文本

数据绑定最常见的形式就是使用“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 指令

能执行一次性地插值，当数据改变时，插值处的内容不会更新。

<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>