VueJS渲染一旦进入一个元素

Question

是否有可能只呈现一旦进入一个元素？

假设我有一个DIV CONTENTEDITABLE，只需要渲染的第一个值，然后停止重新描绘为模型的变化。这里只会显示初始值variable。

<div contenteditable="true"> {{variable}} </div>

Answer 1

使用v-once

<div contenteditable="true" v-once> {{variable}} </div> 

你也可以用<span>包装它：

<div contenteditable="true"> 
    <span v-once> {{variable}} </span> 
</div> 

裁判：
https://vuejs.org/v2/guide/components.html#Cheap-Static-Components-with-v-once https://vuejs.org/v2/api/#v-once

---

或者另一种解决方案是简单地克隆variable只是不，如果你把它readOnlyVariable修改它，例如：

<div contenteditable="true"> {{readOnlyVariable}} </div>