当前阅读教程:Vue.JS入门教程 > 数据绑定 v-once指令 | |
阅读(22555525) 收藏 赞(5685) 分享 | |
上一篇: 数据绑定 v-text指令 | 下一篇: 数据绑定 v-cloak指令 |
该指令后面不需要跟任何表达式(v-for后面接表达式)。 该指令表示元素和组件只渲染一次,不会随着数据的改变而改变。 v-once在日常开发中用的很多, 只渲染元素和组件一次,随后的渲染,使用了此指令的元素/组件及其所有的子节点,都会当作静态内容并跳过,这可以用于优化更新性能。 常见用法如下: 当修改input框的值时,使用了v-once指令的p元素不会随之改变,而第二个p元素时可以随之改变的,示例 代码如下: <div id="app"> <p v-once>{{msg}}</p> <!--msg不会改变--> <p>{{msg}}</p> <p> <input type="text" v-model = "msg" name=""> </p> </div> <script type="text/javascript"> let vm = new Vue({ el : '#app', data : { msg : "hello" } }); </script> |
|
上一篇: 数据绑定 v-text指令 | 下一篇: 数据绑定 v-cloak指令 |