vue 动态添加组件

关键： vue 的 :is 属性

最权威的，当然是vue官方说明

这是一个示例：

这段代码中，component 这个组件名在最后会被item.component 的具体值替代。

export default {
  data(){
    return {
      list: [
      {
        component: "v-circle",
        config: {
          x: 100,
          y: 100,
          radius: 70,
          fill: "red",
          stroke: "black",
          strokeWidth: 4,
          draggable: true,
        },
      },
      {
        component: "v-circle",
        config: {
          x: 100,
          y: 100,
          radius: 70,
          fill: "red",
          stroke: "black",
          strokeWidth: 4,
          draggable: true,
        },
      },
      {
        component: "v-rect",
        config: {
          x: 20,
          y: 20,
          width: 100,
          height: 50,
          fill: "green",
          stroke: "black",
          strokeWidth: 4,
          draggable: true,
        },
      },
    ],
    }
  }


}