vue介绍
vue.js是构建数据驱动的 web 界面的库,而不是一个全能框架—它只聚焦于视图层。
响应的数据绑定
每当修改了数据,DOM 便相应地更新。这样我们应用中的逻辑就几乎都是直接修改数据了,不必与 DOM 更新搅在一起。这让我们的代码更容易撰写、理解与维护。
组件系统
让我们可以用独立可复用的小组件来构建大型应用。
特性
简洁 数据驱动 组件化 轻量快速 模块友好
vue的安装
CDN地址
http://cdn.jsdelivr.net/vue/1.0.24/vue.min.js
bower下载
bower install vue
npm下载
npm install vue
vue的简单使用
引入vue.js
实现简单的Hello World
<div id="app">
{{hello}}
</div>
new Vue({
el:"##app",
data:{
hello:'hello world'
}
});
实现双向数据绑定
v-model
<div id="app">
<input type="text" v-model="hello">
{{hello}}
</div>
new Vue({el:"##app"});
绑定表达式
可以进行运算
{{}}
支持三元运算符
只绑定一次
{{*hello}}
new Vue({el:"##app",hello:{data:'hello'}});
实现绑定html
{{{hello}}}
new Vue({el:"##app",data:{hello:'hello world
'}});