组件删除后设置置空

src/views/book/courseware/create/components/CreateCanvas.vue

@@ -107,6 +107,7 @@ export default {
   components: {
     PreviewEdit,
   },
+  inject: ['getCurSettingId'],
   props: {
     isEdit: {
       type: Boolean,
@@ -174,6 +175,21 @@ export default {
         this.gridInsertType = '';
       },
     },
+    'data.row_list': {
+      handler(val) {
+        // row_list 更改时判断是否有当前设置 id 的组件
+        const curSettingId = this.getCurSettingId();
+        const find = val.find((row) => {
+          return row.col_list.find((col) => {
+            return col.grid_list.find((grid) => grid.id === curSettingId);
+          });
+        });
+        if (!find) {
+          this.$emit('showSettingEmpty');
+        }
+      },
+      immediate: true,
+    },
   },
   created() {
     GetCoursewareContent({ id: this.courseware_id }).then(({ content }) => {

src/views/book/courseware/create/index.vue

@@ -43,6 +43,7 @@
         ref="createCanvas"
         :is-edit="isEdit"
         @showSetting="showSetting"
+        @showSettingEmpty="showSettingEmpty"
         @changeData="changeData"
         @back="back"
         @changeEditStatus="changeEditStatus"
@@ -140,6 +141,11 @@ export default {
     showSetBackground() {
       this.visible = true;
     },
+    // 显示设置置空
+    showSettingEmpty() {
+      this.curSettingType = '';
+      this.curSettingId = '';
+    },
     /**
      * 显示设置
      * @param {object} setting 组件设置