问题

// parent.vue
  <svg>
    <child></demo>
  </svg>
  
// child.vue
<template>
  <text>123</text>
</template>

<script>
export default {
  mounted() {
    let h = this.$createElement;
    this.$notify({
      title: `这种方式得到的VNode,他的ns为"svg"`,
      message: h("div", null, [h("span", null, 123), h("button", null, 123)]),
      // message:<div><span>123</span><button>123</button> //jsx方式也是相同问题
    });
    //最后只会展示出一个title
  },
};
</script>

原因

在child.vue中的createElement会记录下来父节点的tagName，比如本例中父组件是svg，vue限制了svg下不能放非法tag名

解决方法

1. 将父组件的$createElement以props的方式传到child.vue中
2. 手动修改子组件创建出来的VNode的属性，让vue知道他不是svg的子组件（求放过）

关键字 keyword

Element-UI , svg , not work , Notification ,$createElement