vue.js NuxtJs nuxt-link在通过props解析时不工作

mwg9r5ms  于 2023-05-07  发布在  Vue.js
关注(0)|答案(1)|浏览(136)

我有一个模板,它接收数据和呈现为html,我想使用像<nuxt-link />这将允许无需重新加载页面导航组件。在下面找到我的代码。

<template>
 <div v-html="content"> </div>
</template>
<script>
 export default{
   name: 'MyComponent',
   props:{
     content: {
       type: String,
       default: ''
     }
   }
 }
</script>

然后我在父节点中调用它,如下所示

<template>
  <my-component :content="content" />
</template>
<script>
 export default{
   name: 'ParentComponent',
   data(){
     return {
       content: `Click <nuxt-link to="/login">here</nuxt-link> to login <div>Just some random tex</div>`
     }
   }
 }
</script>

内容被呈现为html,但nuxt-link组件不工作。请问我该怎么做

eyh26e7m

eyh26e7m1#

你不能这样做,v-html是用来渲染纯html组件的(比如div,inputs等),在你的例子中,你想渲染一个虚拟的vue组件(nuxt-link),在这种情况下,我建议看看Vue。编译以基于字符串生成虚拟DOM

相关问题