fix: fix array setter sort and data change bugs

liujuping · liujuping · commit 9dbb22bcf867 · 2023-05-11T16:40:59.000+08:00
diff --git a/src/setter/array-setter/index.tsx b/src/setter/array-setter/index.tsx
@@ -21,7 +21,7 @@ interface ArraySetterState {
  * @param target
  * @param value
  */
-function onItemChange (target: IPublicModelSettingField, items: IPublicModelSettingField[], props: ArraySetterProps) {
+function onItemChange (target: IPublicModelSettingField, index: number, item: IPublicModelSettingField, props: ArraySetterProps) {
   const targetPath: Array<string | number> = target?.path;
   if (!targetPath || targetPath.length < 2) {
     console.warn(
@@ -31,8 +31,7 @@ function onItemChange (target: IPublicModelSettingField, items: IPublicModelSett
     );
     return;
   }
-  const { field, value: fieldValue } = props;
-  // const { items } = this.state;
+  const { field } = props;
   const { path } = field;
   if (path[0] !== targetPath[0]) {
     console.warn(
@@ -41,11 +40,9 @@ function onItemChange (target: IPublicModelSettingField, items: IPublicModelSett
     return;
   }
   try {
-    const index = +targetPath[targetPath.length - 2];
-    if (typeof index === 'number' && !isNaN(index)) {
-      fieldValue[index] = items[index].getValue();
-      field?.extraProps?.setValue?.call(field, field, fieldValue);
-    }
+    const fieldValue = field.getValue();
+    fieldValue[index] = item.getValue();
+    field?.extraProps?.setValue?.call(field, field, fieldValue);
   } catch (e) {
     console.warn('[ArraySetter] extraProps.setValue failed :', e);
   }
@@ -89,10 +86,11 @@ export class ListSetter extends Component<ArraySetterProps, ArraySetterState> {
           extraProps: {
             defaultValue: value[i],
             setValue: (target: IPublicModelSettingField) => {
-              onItemChange(target, items, props);
+              onItemChange(target, i, item, props);
             },
           },
         });
+        item.setValue(value[i]);
       }
       items.push(item);
     }
@@ -108,10 +106,9 @@ export class ListSetter extends Component<ArraySetterProps, ArraySetterState> {
     const values: any[] = [];
     const newItems: IPublicModelSettingField[] = [];
     sortedIds.map((id, index) => {
-      const item = items[+id];
-      item.setKey(index);
-      values[index] = oldValues[id];
-      newItems[index] = item;
+      const itemIndex = items.findIndex(item => item.id === id);
+      values[index] = oldValues[itemIndex];
+      newItems[index] = items[itemIndex];
       return id;
     });
     this.setState({
@@ -174,7 +171,7 @@ export class ListSetter extends Component<ArraySetterProps, ArraySetterState> {
           <Sortable itemClassName="lc-setter-list-card" onSort={this.onSort.bind(this)}>
             {items.map((field, index) => (
               <ArrayItem
-                key={index}
+                key={field.id}
                 scrollIntoView={scrollToLast && index === lastIndex}
                 field={field}
                 onRemove={this.onRemove.bind(this, field)}
