<div id="app" v-cloak>
<h2>当前计数:{{counter}}</h2>
<h2>{{message + message}}</h2>
<h2 v-once>{{message}}</h2>
<h2 v-html="url"></h2>
<h2 v-pre>{{message}}</h2>
<button v-on:click="add">+</button>
<button v-on:click="sub">-</button>
</div> <script src="js/vue.js"></script>
<h2 v-text='message'>,ccc</h2>
<script>
const app =new Vue({
el:'#app',
data:{
counter:0,
message:'aaa',
url:'<a href="www.baidu.com">百度</a>'
},
methods:{ add: function(){ this.counter++ }, sub:function(){ this.counter-- } } }) </script>
</body>
通过mustache也就是{{}}插入值
插值操作时可以进行简单的算式如message+message
<h2 v-once>{{message}}</h2>
v-once:不随着属性改变而变化
<h2 v-html="url"></h2>
v-html:以解析html格式来解析，并显示对应的内容
<h2 v-text='message'>,ccc</h2>
v-text和插入有点相似，不过当后面想添加东西时会覆盖message而不是添加在message后面
<h2 v-pre>{{message}}</h2>
v-pre :不去解析message而是原封不动的显示{{message}}
v-cloak: 在vue解析前有属性v-cloak,让原样式不变，等vue解析后会删除v-cloak。
