Javascript 如何在vue.js中以纯文本形式在v-html和insert之间切换？

我希望在vue.jsv2中在v-html和插入为纯文本之间切换。到目前为止，我有这个

HTML

{{html？''：text}
转换

JS

newvue({
el:“应用程序”，
数据：{
文字：“你好
世界”，
html:false
},
方法：{
切换：函数（）{
this.html=！this.html；
}
}
})

但是当

html

为false时，这不起作用。我怎样才能让它工作？我正在寻找一种解决方案，不需要使用

v-else

重复

两次。如果我只需要1

标签就可以了，那就更好了

---

谢谢

使用带有

prop

修饰符的

v-bind

newvue({
el:“应用程序”，
数据：{
文字：“你好
世界”，
html:false
},
计算：{
headingProps（）{
返回this.html？{innerHTML:this.text}:{innerText:this.text}；
},
},
方法：{
切换：函数（）{
this.html=！this.html；
}
}
})

转换

<div id="app">
  <h2 v-html="html ? text : undefined">{{html ? '' : text}}</h2>
  <button @click="toggle">
    switch
  </button>
</div>

new Vue({
  el: "#app",
  data: {
    text:"Hello<br/>World",
    html:false
  },
  methods: {
    toggle: function(){
        this.html = !this.html;
    }
  }
})