Html 在vuejs中将字符串转换为Dom

最近，我想在vue组件中将stirng转换为Dom，但它没有按照我的预期工作。我的代码如下所示：

  // what I wrote in the template
  <div id="log">
      {{libText}}
  </div>

  // what I wrote in js
        Vue.component(...  , {
        template: ...  ,
        data: function () {
               return ...     
            }
        },
        computed: {           
            libText:function(){
                var str="<p>some html</p>";
                var div = document.createElement('div');
                div.innerHTML = str;
                return div;
            }
        },
        methods:{...}
        })

//我在模板中写的内容
{{libText}}
//我用js写的东西
Vue.组件（{
模板：，
数据：函数（）{
返回。。。
}
},
计算：{
libText:function（）{
var str=“一些html
”；
var div=document.createElement（'div'）；
div.innerHTML=str；
返回div；
}
},
方法：{…}
})

我得到的结果是字符串“[object htmldevelment]”，而不是Dom。

---

如果有人能帮我解决这个问题就太好了

一个可能的解决方案是：

模板：

<div id="log">
    {{{libText}}}
</div>

{{{libText}}}

注意三元组{}用于获取原始html/文本解释

Javascript:

Vue.component(...  , {
    template: ...  ,
    data: function () {
           return ...     
        }
    },
    computed: {           
        libText:function(){
            // return directly html
            var str="<div><p>some html</p></div>";
            return str;
        }
    },
    methods:{...}
});

Vue.component（{
模板：，
数据：函数（）{
返回。。。
}
},
计算：{
libText:function（）{
//直接返回html
var str=“一些html
”；
返回str；
}
},
方法：{…}
});

如果您使用的是Vue 2，请使用

v-html

指令：

<div v-html="yourVariable"></div>

---

即使您想将其保留为字符串，它也能完美工作。谢谢