在Vue.js插件组件的createElement中呈现模板字符串

Question

我正在尝试在createElement函数中编译模板字符串。我需要用<nuxt-link />传递模板字符串。

我几乎尝试了所有的东西，包括用模板字符串传递"is"道具的createElement('component')，以及尝试Vue.compile，结果如下：

Vue.compile不是一个函数

内部index.vue

<template>
<div>
<example :tmpl="tmpl" />
</div>
</template>
<script>
export default {
name: "index",
data() {
return {
};
},
computed: {
tmpl() {
return `<nuxt-link :to="${this.localePath({ name:'categories-index'}, this.$i18n.locale)}">Categories</nuxt-link>`;
}
}
};
</script>

内部example.js我尝试过：

const Example = {
install(Vue, options) {
Vue.component('example', {
render: function (createElement) {
return createElement(
'component',
{
props: {
'is': this.tmpl
}
}
)
},
props: {
tmpl: {
type: String,
default: ""
}
},
data() {
return {
}
},
});
}
};
export default Example;

也：

const Example = {
install(Vue, options) {
Vue.component('example', {
render: function (createElement) {
return createElement(
'div',
{
'props': {
}
},
// error: Vue.compile is not a function
Vue.compile(this.tmpl)
)
},
props: {
tmpl: {
type: String,
default: ""
}
},
data() {
return {
}
},
});
}
};
export default Example;

也：

const Example = {
install(Vue, options) {
Vue.component('example', {
render: function (createElement) {
return createElement(
'div',
{
// error: nuxt-link is plain html instead of link
domProps: {
innerHTML: this.tmpl
},
}
)
},
props: {
tmpl: {
type: String,
default: ""
}
},
data() {
return {
}
},
});
}
};
export default Example;

最后一个渲染了HTML，但vue代码没有编译，所以nuxt-link不起作用。

我希望用vuecreateElement函数(使用模板字符串(呈现编译后的vue代码。

Answer 1

是否安装了Vue编译器？(不确定Nuxt是否缺少它-请参阅https://v2.vuejs.org/v2/guide/installation.html#Runtime-仅限编译器与运行时(，但Vue.compile is not a function可能暗示我缺少它？

可能类似以下内容：

// nuxt.config.js
export default {
build: {
extend (config, { isClient }) {
config.resolve.alias['vue$'] = 'vue/dist/vue.esm.js'
}
}
}

以上学分(https://forum.vuejs.org/t/nuxt-render-function-for-a-string-of-html-that-contains-vue-components/63645/2)