修复切换组件时,数据的设置数据不更新的问题

packages/bigscreen/designer/components/datasourcePicker.vue

@@ -11,7 +11,7 @@
       </ai-dialog-btn>
     </div>
     <template v-else-if="source.dataType === 'staticData'">
-      <table-editor label="设置数据" v-model="tableData" :configs.sync="colConfigs" @data="changeData"/>
+      <table-editor label="设置数据" v-model="staticDataOps.tableData" :configs.sync="staticDataOps.colConfigs" @data="changeData"/>
     </template>
     <config-item v-else-if="source.dataType === 'dynamicData'" label="数据源">
       <ai-select v-model="source.sourceDataId" placeholder="请选择数据源" :instance="instance"
@@ -50,8 +50,6 @@ export default {
       dataTypes: Object.entries(DvCompData.types).map(e => ({id: e[0], label: e[1]})),
       content: "",
       loading: false,
-      tableData: [],
-      colConfigs: []
     }
   },
   computed: {
@@ -64,6 +62,40 @@ export default {
       get() {
         return this.options
       }
+    },
+    staticDataOps() {
+      const columnProp = "name", ops = {colConfigs: [], tableData: []}
+      if (Array.isArray(this.options.staticData)) {
+        const columns = []
+        ops.colConfigs = []
+        this.options.staticData.map((row, i) => {
+          const prop = `c${i || ""}`
+          ops.colConfigs.push({label: row[columnProp] || row.key, prop})
+          Object.entries(row).map(([k, v]) => {
+            console.log("梳理数据单元:", k, v)
+            if (/^v/.test(k) && k != "value") {
+              const item = ops.tableData[k.substring(1) || 0] || {}
+              item[prop] = v
+              ops.tableData[k.substring(1) || 0] = item
+            } else if (![columnProp, 'key'].includes(k)) {
+              const index = columns.findIndex(e => k == e)
+              if (index > -1) {
+                const item = ops.tableData[index] || {}
+                item[prop] = v
+                ops.tableData[index] = item
+              } else {
+                columns.push(k)
+                const newIndex = columns.length - 1
+                const item = ops.tableData[newIndex] || {}
+                item[prop] = v
+                ops.tableData[newIndex] = item
+              }
+            }
+          })
+        })
+        ops.tableData = ops.tableData.map(e => ({...e, $cellEdit: false}))
+      }
+      return ops
     }
   },
   methods: {
@@ -72,43 +104,7 @@ export default {
           new DvCompData(this.source.dataType, this.source, this.instance).getData().then(data => {
             this.source[this.source.dataType] = data
           })
-    },
-    initStaticDataProps() {
-      const columnProp = "name"
-      if (Array.isArray(this.options.staticData)) {
-        const columns = []
-        this.options.staticData.map((row, i) => {
-          const prop = `c${i || ""}`
-          this.colConfigs.push({label: row[columnProp] || row.key, prop})
-          Object.entries(row).map(([k, v]) => {
-            if (/^v/.test(k)) {
-              const item = this.tableData[k.substring(1) || 0] || {}
-              item[prop] = v
-              this.tableData[k.substring(1) || 0] = item
-            } else if (![columnProp, 'key'].includes(k)) {
-              const index = columns.findIndex(e => k == e)
-              console.log(index)
-              if (index > -1) {
-                const item = this.tableData[index] || {}
-                item[prop] = v
-                this.tableData[index] = item
-              } else {
-                columns.push(k)
-                const newIndex = columns.length - 1
-                const item = this.tableData[newIndex] || {}
-                item[prop] = v
-                this.tableData[newIndex] = item
-              }
-            }
-          })
-        })
-        this.tableData = this.tableData.map(e => ({...e, $cellEdit: false}))
-      }
     }
-  },
-  created() {
-    //新版静态数据
-    this.initStaticDataProps()
   }
 }
 </script>

packages/bigscreen/designer/components/tableEditor.vue

@@ -15,7 +15,6 @@ export default {
   },
   data() {
     return {
-      records: [],
       form: {}
     }
   },
@@ -44,7 +43,8 @@ export default {
         })
       }
     },
-    columns: v => v.configs
+    columns: v => v.configs,
+    records: v => v.tableData.map(e => ({$cellEdit: true, ...e}))
   },
   methods: {
     rowSave(form, done) {
@@ -74,16 +74,13 @@ export default {
       })
     }
   },
-  created() {
-    this.records = this.tableData.map(e => ({$cellEdit: true, ...e}))
-  }
 }
 </script>
 
 <template>
   <section class="tableEditor">
     <avue-crud :option="option" :data="records" @row-save="rowSave" @row-cancel="rowSave" @row-del="rowDel">
-      <template v-for="c in columns" :slot="`${c.prop}Header`" slot-scope="{column = {}}">
+      <template v-for="col in columns" :slot="`${col.prop}Header`" slot-scope="{column = {}}">
         <el-input class="headerInput" v-model="column.label" clearable placeholder="请输入列名" @change="$emit('update:configs', columns)"/>
       </template>
       <template v-if="label" v-slot:menuLeft>