在 Vue.js 中使用自定义渲染功能创建文本 node

我使用了一个my-link组件，根据需要将锚定标签包装在各种物品上.为此，使用了一个定制的render方法——然而createElement方法只能创建HTML node ，创建纯文本 node 似乎是不可能的.

当前情景

Usage of my-link component

<template v-for="item in items">
  <h4>
    <my-link :url="item.url">{{ item.text }}</my-link>
  </h4>
</template>

Implementation of my-link component as Link.vue

<script>
export default {
  name: 'my-link',
  props: { url: String },
  render(createElement) {
    if (this.url) {
      return createElement(
          'a', {
            attrs: { href: this.url }
          }, this.$slots.default
      );
    }

    return createElement(
        'span',
        this.$slots.default
    );
  }
};
</script>

生成的HTML

<h4>
  <a url="/some-link">This item is linked</a>
</h4>
<h4>
  <span>Plain text item</span>
</h4>

预期情景

在这个特定场景中，span标签是多余的，可以避免——但是，我不清楚Vue如何以及是否可以实现这一点.js.一般来说，我想知道如何使用自定义render方法创建纯文本 node .

<h4>
  <a url="/some-link">This item is linked</a>
</h4>
<h4>
  Plain text item
</h4>

旁注:

• 问题最初是针对VueJS v2提出的.1&amp；v2.2-beta(2017年2月)
• 重点是适当的语义 node (文本 node 与元素 node )