【问题标题】：vue.js i used 'v-once' in 'v-for' statement,why can't find 'item'?vue.js 我在'v-for'语句中使用了'v-once'，为什么找不到'item'？
【发布时间】：2017-05-13 12:27:43
【问题描述】：

<div v-for="item in imControls.messages" >
    <p v-once>
        <span class="" v-if="item.type==3">{{item.name}}:</span>
        <span class="red" v-if="item.type==4">{{item.name}}:</span>
        <span class="blue" v-if="item.type==2">{{item.name}}:</span>
        <span class="grey" v-if="item.type==1">{{item.name}}:</span>
        <span v-html="item.text"></span>
    </p>
 </div>

imControls.messages 存在，如果我不在p 标签上使用v-once，没关系，但如果我使用v-once，它就找不到项目。

错误是

'vue.js:2574 [Vue 警告]：属性或方法“item”未在实例上定义，但在渲染期间被引用。确保在 data 选项中声明反应数据属性。（在根实例中找到）

vue.js:2217 Uncaught TypeError: Cannot read property 'type' of undefined'

【问题讨论】：

你是在异步加载imControls.messages吗？
是的，imControls.messages 可以更改，但我希望 imControls.messages 中的每个项目在渲染后不需要更改。因为在 item.text 中，它有一些 img 标签字符串，我没有想多次加载img资源。

标签： javascript vue.js

【解决方案1】：

v-once指令可以直接用在v-for中

<div v-for="item in imControls.messages" v-once>
    <span class="" v-if="item.type==3">{{item.name}}:</span>
    <span class="red" v-if="item.type==4">{{item.name}}:</span>
    <span class="blue" v-if="item.type==2">{{item.name}}:</span>
    <span class="grey" v-if="item.type==1">{{item.name}}:</span>
    <span v-html="item.text"></span>
</div>

【讨论】：

【解决方案2】：

v-for 语句中不需要 v-once，因为它在 vue.js 2.0.8 中已修复

4247 修复 v-html 重置内容，即使内容字符串保持不变

【讨论】：