手機(jī)也能上課
1/8
數(shù)據(jù)綁定
文本
數(shù)據(jù)綁定最常見(jiàn)的形式就是使用“Mustache”語(yǔ)法 {{}}
(雙大括號(hào)) 的文本插值:
<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", 頁(yè)面上會(huì)自動(dòng)同步成 “hello nier”。
你也可以點(diǎn)擊嘗試一下, 自己查看效果
v-once 指令
能執(zhí)行一次性地插值,當(dāng)數(shù)據(jù)改變時(shí),插值處的內(nèi)容不會(huì)更新。
<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>