update

src/modules/editor/components/CompUI/customUI/Cards/CardList/component.tsx

@@ -1,6 +1,6 @@
 import { watch } from "vue";
 import { string } from "vue-types";
-import { useChildCreator, useCompData } from ".";
+import { useCompData, useCreateChild } from ".";
 import { useEditor } from "../../../../..";
 import { Image, Text } from "../../../basicUI";
 import { createUIComp } from "../../../defines/createUIComp";
@@ -12,20 +12,20 @@ export const Component = createUIComp({
   setup(props) {
     const { helper } = useEditor();
     const { value, children } = useCompData(props.compId);
-    // const createList = useChildCreator("list");
+    const createList = useCreateChild("list");
 
-    // watch(
-    //   () => [value.total],
-    //   () => {
-    //     const { total } = value;
-    //     const offset = total - children.list.length;
-    //     if (offset > 0) {
-    //       children.list.push(...createList(offset));
-    //     } else {
-    //       children.list.splice(total, offset * -1);
-    //     }
-    //   }
-    // );
+    watch(
+      () => [value.total],
+      () => {
+        const { total } = value;
+        const offset = total - children.list.length;
+        if (offset > 0) {
+          children.list.push(...createList(offset));
+        } else {
+          children.list.splice(total, offset * -1);
+        }
+      }
+    );
 
     return () => (
       <div

src/modules/editor/components/CompUI/customUI/Cards/CardList/index.tsx

@@ -11,7 +11,7 @@ export const options = {
   thumbnail: Dict_Imgs.Default,
 };
 
-export const { createComp, useCompData, useChildCreator } = createCompHooks({
+export const { createComp, useCompData, useCreateChild } = createCompHooks({
   value: {
     gap: 10,
     columns: 3,
@@ -21,14 +21,14 @@ export const { createComp, useCompData, useChildCreator } = createCompHooks({
   },
   children: {
     list: (length = 3) =>
-      Array.from({ length }, (_, i) => ({
+      Array.from({ length }, () => ({
         img: createCompId("Image", {
           value: {
             url: Dict_Imgs.Default,
           },
         }),
         desc: createCompId("Text", {
-          value: "描述" + ++i,
+          value: "描述",
         }),
       })),
     img1: () =>

src/modules/editor/components/CompUI/defines/createCompHooks.ts

@@ -3,6 +3,7 @@ import { DesignComp } from "@/modules/editor/defines/DesignTemp/DesignComp";
 import { Background, Layout } from "@/modules/editor/typings";
 import { cloneDeep } from "lodash";
 import { AnyFun } from "queenjs/typing";
+import { addCacheToMap } from "./createCompId";
 
 type IOptions<T, C> = {
   value: T;
@@ -34,12 +35,19 @@ export function createCompHooks<T, C extends { [name: string]: AnyFun }>(
     };
   }
 
-  function useChildCreator(key: keyof C) {
-    //
+  function useCreateChild<T extends keyof C>(key: T) {
+    const editor = useEditor();
+    const createChild: any = (...args: any) => {
+      const result = (defaultOpts as any).children[key](...args);
+      addCacheToMap(editor.store.designData.compMap);
+      return result;
+    };
+    return createChild as C[T];
   }
+
   return {
     createComp,
     useCompData,
-    useChildCreator,
+    useCreateChild,
   };
 }