json_schema_form_react_native_web_quickstart_with_state.ts

1import React, { useState } from 'react';
2import { View } from 'react-native';
3import { JsonSchemaForm } from '@dwidge/json-schema-form-rnw';
4
5const schema = {
6  type: 'object',
7  properties: {
8    name: { type: 'string', title: 'Name' },
9    age: { type: 'number', title: 'Age' },
10    subscribe: { type: 'boolean', title: 'Subscribe to newsletter' },
11  },
12  required: ['name'],
13};
14
15const QuickStartForm = () => {
16  const [data, setData] = useState({
17    name: 'John Doe',
18    age: 30,
19    subscribe: true,
20  });
21
22  const handleChange = (newData: any) => {
23    setData(newData);
24    console.log('Form Data:', newData);
25  };
26
27  return (
28    <View style={{ padding: 20 }}>
29      <JsonSchemaForm
30        schema={schema}
31        data={data}
32        onChange={handleChange}
33      />
34    </View>
35  );
36};
37
38export default QuickStartForm;