下载https://vuejs.org/js/vue.js (复制粘贴也行)
新建html
引入vue
<html>
<head>
<meta charset = 'utf-8'>
</head>
<script src="vue.js" type="text/javascript" ></script>
<body>
<div id="app">
<!-- 默认的读取方式{{ key }} 下面的temple 为key-->
<p>{{temple}}</p>
</div>
</body>
<script>
var app = new Vue({
//所要应用区域的id
el:"#app",
//需要操作的数据
data:{
temple:'helloword'
}
})
</script>
</html>
运行成功
v-model 的绑定 (实现数据的多处显示联动)
<html>
<head>
<meta charset='utf-8'>
<title></title>
</head>
<script src="vue.js" type="text/javascript"></script>
<body>
<div id="app">
<p>{{message}}</p>
<input v-model="message"/>
</div>
</body>
<script>
var app = new Vue({
el:'#app',
data:{
message:"2000"
}
});
</script>
</html>
运行结果如图