手機也能上課
1/8
數據綁定
文本
數據綁定最常見的形式就是使用“Mustache”語法 {{}}
(雙大括號) 的文本插值:
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<span id="app">Message: {{ msg }}</span>
<script>
var vm = new Vue({
el:'#app',
data:{
msg: "hello w3cschool"
}
});
setTimeout(()=>{
vm.msg = "hello nier";
}, 1000);
</script>
如上所示我們給 msg 賦值 "hello w3cschool", 一秒后修改msg的值為"hello nier", 頁面上會自動同步成 “hello nier”。
你也可以點擊嘗試一下, 自己查看效果
v-once 指令
能執(zhí)行一次性地插值,當數據改變時,插值處的內容不會更新。
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<span id="app" v-once>Message: {{ msg }}</span>
<script>
var vm = new Vue({
el:'#app',
data:{
msg: "hello w3cschool"
}
});
setTimeout(()=>{
vm.msg = "hello nier";
}, 1000);
</script>