'init'

src/components/ListDialog/index.js

@@ -0,0 +1,11 @@
+import Vue from 'vue'
+// 按照方法调用vue组件，用完即销毁
+const ListDialogConstrctor = Vue.extend(require('./main.vue').default)
+// 定义原型方法
+Vue.prototype.$createListReview = (options) => {
+  const instance = new ListDialogConstrctor({
+    data: options
+  })
+  instance.vm = instance.$mount()
+  document.getElementById('app').appendChild(instance.vm.$el)
+}

src/components/ListDialog/main.vue

@@ -0,0 +1,38 @@
+<!--
+ * @Date: 2020-12-14 09:07:03
+ * @LastEditors: guo
+ * @LastEditTime: 2020-12-16 15:10:51
+ * @FilePath: \basic-admin\src\components\ListDialog\main.vue
+ * @Description:
+-->
+<template>
+  <el-dialog :visible="visible" :destroy-on-close="true" :before-close="handleClose" title="查看子变量">
+    <el-table :data="list" border stripe>
+      <el-table-column prop="vt" label="数据类型" />
+      <el-table-column prop="val" label="数据值" />
+    </el-table>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: 'ListDialog',
+  data() {
+    return {
+      visible: true,
+      list: []
+    }
+  },
+  methods: {
+    handleClose() {
+      this.$destroy(true)
+      this.$el.parentNode.removeChild(this.$el)
+    }
+  }
+}
+</script>
+<style>
+#root-pic {
+  display: none;
+}
+</style>