内容简介
vue.js 是一个用来开发Web界面的前端库。
1.vue.js 是什么
vue.js 是一个构建数据驱动的web界面的库,vue.js 通过简单的API提供高效的数据绑定和灵活的组件系统。
- vue.js 特性: 体积小,数据绑定,指令
- vue 不支持低端浏览器ie6/7/8
2.vue 的使用
- yarn add -D vue
vue 正式发布于2014/2
3.数据绑定
数据绑定是将数据和视图相关联,当数据发生变化时,可以自动更新视图。
3.1语法
3.1.1 插值
文本插值,使用双大括号,{{}},
- {{*text}} // 只需渲染一次数据,后续数据变化不再关心,可以通过
*
实现 - 变量中是html片段时,可以使用三个大括号来绑定,如果使用两个大括号,html 会被当成是字符串
<span>{{{logo}}}<span>
logo: '<span>AAA</span>'
- 双大括号也可以放在HTML标签内
<li data-id='{{id}}'></li>
注意: vue 指令和自身特性是不可以插值的,如果用错地方,vue会发出警告。
3.2表达式
{{}} 中接受表达式的值,表达式可以由JavaScript表达式和过滤器构成,过滤器可以没有,可以有多个。
表达式是各种数值、变量、运算符的综合体
{{example | filterA | filterB a b}} // 过滤器例子, a b 是参数