您好,登錄后才能下訂單哦!
本篇內容主要講解“vue指令中的v-once怎么使用”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“vue指令中的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-once 能夠讓標簽的內容,也就是 {{str}} 中,data里面的某個數據例如str,保持在vue的data初始化之后,str的第一個值。
下面的寫法
<div v-once>{{str}} </div> <el-input v-model="str"></el-input>
str初始是’’,空字符串;
然后在created中從后端接口獲得數據給str賦值:this.str = ‘aaa’;
最后在mounted中江str清空:this.str = ‘’;
獲得效果
到此,相信大家對“vue指令中的v-once怎么使用”有了更深的了解,不妨來實際操作一番吧!這里是億速云網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。