v1.0.5

Author: lin-mt

README.md

@@ -22,7 +22,6 @@ export default () => {
   const [jsonData, setJsonData] = useState({});
   return (
     <JsonSchemaEditor
-      mock={true}
       data={jsonData}
       onChange={(data) => {
         setJsonData(data);

package-lock.json

@@ -34,7 +34,6 @@ const Option = Select.Option;
 type SchemaItemProps = {
   propertyName?: string;
   nodeDepth?: number;
-  parentSchemaDepth?: number;
   namePath?: number[];
   isArrayItems?: boolean;
   isRequire?: boolean;
@@ -48,11 +47,7 @@ type SchemaItemProps = {
   renameProperty?: (namePath: number[], name: string) => void;
   removeProperty?: (namePath: number[]) => void;
   addProperty?: (path: number[], isChild: boolean) => void;
-  updateRequiredProperty?: (
-    path: number[],
-    requiredProperty: string,
-    removed: boolean,
-  ) => void;
+  updateRequiredProperty?: (namePath: number[], removed: boolean) => void;
   handleAdvancedSettingClick?: (
     namePath: number[],
     schema: JSONSchema7,
@@ -66,7 +61,6 @@ function SchemaItem(props: SchemaItemProps) {
     renameProperty,
     isArrayItems,
     updateRequiredProperty,
-    parentSchemaDepth = 0,
     removeProperty,
     addProperty,
     isRequire,
@@ -165,11 +159,7 @@ function SchemaItem(props: SchemaItemProps) {
             style={{ padding: 0 }}
             onChange={(checked) => {
               if (updateRequiredProperty && propertyName) {
-                updateRequiredProperty(
-                  namePath.slice(0, parentSchemaDepth),
-                  propertyName,
-                  !checked,
-                );
+                updateRequiredProperty(namePath, !checked);
               }
             }}
           />
@@ -344,9 +334,8 @@ function SchemaItem(props: SchemaItemProps) {
                   {...props}
                   isRequire={schema.required?.includes(name)}
                   isArrayItems={false}
-                  defaultExpand={props.defaultExpand}
+                  defaultExpand={defaultExpand}
                   nodeDepth={nodeDepth + 1}
-                  parentSchemaDepth={!isRoot ? parentSchemaDepth + 2 : 0}
                   namePath={namePath.concat(
                     getPropertyIndex(schema, 'properties'),
                     getPropertyIndex(schema.properties, name),
@@ -366,8 +355,7 @@ function SchemaItem(props: SchemaItemProps) {
           isRequire={false}
           isArrayItems={true}
           nodeDepth={nodeDepth + 1}
-          defaultExpand={props.defaultExpand}
-          parentSchemaDepth={!isRoot ? parentSchemaDepth + 1 : 0}
+          defaultExpand={defaultExpand}
           propertyName={'items'}
           namePath={namePath.concat(getPropertyIndex(schema, 'items'))}
           schema={schema.items as JSONSchema7}

src/JsonSchemaEditor/SchemaItem/index.tsx

@@ -3,25 +3,7 @@ export const defaultSchemaMock = {
   type: 'object',
   properties: {
     field: {
-      title: '默认标题',
-      type: 'object',
-      properties: {
-        name: {
-          title: '',
-          type: 'string',
-        },
-      },
-    },
-    col: {
-      title: '默认标题',
-      type: 'object',
-      properties: {
-        age: {
-          title: '',
-          type: 'string',
-          description: '默认描述',
-        },
-      },
+      type: 'string',
     },
   },
 };

src/JsonSchemaEditor/defaultMock.ts

@@ -10,7 +10,7 @@ yarn add @quiet-front-end/json-schema-editor-arco
 ```jsx
 import { JsonSchemaEditor } from '@quiet-front-end/json-schema-editor-arco';
 
-export default () => <JsonSchemaEditor defaultExpand={false} />;
+export default () => <JsonSchemaEditor />;
 ```
 
 ## Notice
@@ -59,6 +59,14 @@ JsonSchema 变更的回调。
 }
 ```
 
+### defaultExpand
+
+默认是否展开节点。
+
+类型：`boolean`
+
+默认值：`true`
+
 ### handleAdvancedSettingClick
 
 点击`高级设置`按钮的回调，返回`false`：不使用默认表单，返回`true`：使用默认表单。

src/JsonSchemaEditor/index.md

@@ -10,7 +10,7 @@ import React, {
 import { defaultSchemaMock } from './defaultMock';
 import SchemaItem from './SchemaItem';
 import { JSONSchema7, SchemaEditorProps } from './types';
-import { getDefaultSchema, inferSchema } from './utils';
+import { getDefaultSchema, getValueByPath, inferSchema } from './utils';
 
 export interface JsonSchemaEditorHandle {
   changeSchema: (namePath: number[], value: any, propertyName?: string) => void;
@@ -161,23 +161,31 @@ const JsonSchemaEditor = forwardRef<JsonSchemaEditorHandle, SchemaEditorProps>(
       }
     }
 
-    function updateRequiredProperty(
-      path: number[],
-      requiredProperty: string,
-      removed: boolean,
-    ) {
-      // console.log("updateRequiredProperty", path, requiredProperty, removed);
+    function updateRequiredProperty(namePath: number[], removed: boolean) {
+      if (namePath.length < 2) {
+        console.error('路径长度不足，无法更新必选属性');
+        return;
+      }
+
       let schemaClone = _.cloneDeep(schema);
-      let current: any = schemaClone;
-      for (let i = 0; i < path.length; i++) {
-        const index = path[i];
-        const keys = Object.keys(current);
-        if (typeof current[keys[index]] === 'undefined') {
-          current[keys[index]] = {};
-        }
-        current = current[keys[index]];
+
+      const parentPath = namePath.slice(0, -2);
+      const propertyIndex = namePath[namePath.length - 1];
+
+      const parentObject = getValueByPath(schemaClone, parentPath);
+      if (!parentObject || !parentObject.properties) {
+        console.error('无法找到必选属性的父对象', parentObject);
+        return;
+      }
+
+      const propertyKeys = Object.keys(parentObject.properties);
+      if (propertyIndex < 0 || propertyIndex >= propertyKeys.length) {
+        console.error('属性索引超出范围', propertyIndex);
+        return;
       }
-      updateRequired(current, requiredProperty, removed);
+
+      const propertyName = propertyKeys[propertyIndex];
+      updateRequired(parentObject, propertyName, removed);
       setSchema(schemaClone);
     }
 

src/JsonSchemaEditor/index.tsx

@@ -3,6 +3,22 @@ import { JsonSchema } from 'json-schema-library';
 import _ from 'lodash';
 import { JSONSchema7Definition, JSONSchema7TypeName } from './types';
 
+export function getValueByPath(obj: any, path: number[]): any {
+  if (path.length === 0) {
+    return obj;
+  }
+  let current = obj;
+  for (let i = 0; i < path.length; i++) {
+    const key = Object.keys(current)[path[i]];
+    if (key === undefined) {
+      return undefined;
+    } else {
+      current = current[key];
+    }
+  }
+  return current;
+}
+
 // 解析 JSON Schema 中的 $ref
 function resolveRef(schema: JsonSchema, rootSchema: JsonSchema): JsonSchema {
   if (schema.$ref) {