時間：2023-06-07 01:03:02 | 來源：網(wǎng)站運營
時間：2023-06-07 01:03:02 來源：網(wǎng)站運營
vue: html模版：雙大括號的深入：
在線咨詢
<p>{{ name }}</p><p>{{ name+'123' }}</p><p>{{ sayName() }}</p><script> new Vue({ el: '.app', data: { name: 'aimee', }, methods: { sayName: function() { return 'fang' }, } }) </script>指令的深入: <p><a href="{{ link }}">{{ baidu }}</a></p> <!-- 注意點: vue不會分析字符串里的語法(href屬性里的值應是字符串) --> <p><a v-bind:href="link">{{ baidu }}</a></p> <!-- 解決方案: 使用v-bind綁定變量值到屬性值,并且省略雙大括號 --> <p><a v-bind:href=" baiDu() ">{{ baidu }}</a></p> <!-- 可以寫變量和函數(shù) --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script> new Vue({ el: '.app', data: { link: 'https://www.baidu.com', }, methods: { baiDu: function() { return 'https://www.baidu.com' } } })</script>v-once: data字段的值如果在methods等其他函數(shù)中改變，會更著改變之前的結果，如果想在改變之前使用該值可以使用v-once。<p>{{ name }}</p><!-- 被改變 --><p v-once>{{ name }}</p><!-- 在沒有改變變量之前使用v-once的使用,可以防止內容的更改 --><p>{{ sayName() }}</p><p v-once>{{ name }}</p><!-- 只能在沒改之前使用 --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> new Vue({ el: '.app', data: { name: 'aimee' }, methods: { sayName: function() { this.name = 'fang'; // 原本this.name = aimee,但是在這個更改了以后，全局生效，都變成fff return this.name; }, } }) </script> v-html: 如果要在變量中使用html標簽插入，直接插入的話,vue只能識別為字符串，所以我們要使用v-html。(但不推薦使用，安全問題)<p>{{ taobao }}</p><!-- 可以直接渲染html標簽嗎? 不可以的，vue值會把它當做dom節(jié)點 --><p v-html="taobao"></p><!-- 如果要渲染html標簽，確保安全的話可以使用v-html指令綁定變量即可 --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script> new Vue({ el: '.app', data: { taobao: '<a href="https://www.taobao.com">淘寶網(wǎng)</a>' } })</script>關鍵詞：
微信公眾號
版權所有? 億企邦 1997-2025 保留一切法律許可權利。
