1、插值表达式
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <script src="vue.min.js"></script>
7 </head>
8 <body>
9 <div id="app">
10 {{name}}
11 {{name2}}
12 </div>
13
14 </body>
15 <script type="text/javascript">
16 new Vue({
17 el:"#app",
18 data:{
19 name:"rer",
20 name2:"xxx"
21 }
22 })
23 </script>
24 </html>
View Code
2、v-text、v-html、v-model、v-bind
v-model：双向绑定，绑定模型和视图
v-bind：绑定属性，v-bind:href=""
1 <body>
2 <div id="app">
3 <h6 v-text="name"></h6>
4 <div v-html="name2"></div>
5 <input type="text" v-model="name"/>{{name}}
6 <a v-bind:href="ahref">百度一下</a>
7 </div>
8
9 </body>
10 <script type="text/javascript">
11 new Vue({
12 el:"#app",
13 data:{
14 name:"zd",
15 name2:"<input type=\"text\">",
16 ahref:"http://baidu.com"
17 }
18 })
19 </script>
20 </html>
View Code