Vue Day 01

一. 邂逅Vuejs

1.1. 认识Vuejs

• 为什么学习Vuejs
• Vue的读音
• Vue的渐进式
• Vue的特点

1.2. 安装Vue

• CDN引入
• 下载引入
• npm安装

1.3. Vue的初体验

• Hello Vuejs
  • mustache -> 体验vue响应式
• Vue列表展示
  • v-for
  • 后面给数组追加元素的时候, 新的元素也可以在界面中渲染出来
• Vue计数器小案例
  • 事件监听: click -> methods

1.4. Vue中的MVVM

1.6. Vue的声明周期

1.7. 创建Vue时, options可以放那些东西

• el
• data
• methods
• 生命周期函数
• computed

二.插值语法

• mustache语法 ：变量、表达式

• v-once

• v-html

• v-text

• v-pre:

• v-cloak: 斗篷

三. v-bind

3.1. v-bind绑定基本属性

• v-bind:src
• :href

3.2. v-bind动态绑定class

• 对象语法: class='{类名: boolean}'
• 数组语法: class='[类名]'

3.3. v-bind动态绑定style

• 对象语法:style="{css属性名:属性值}"
• 数组语法:[{css属性名:属性值}]

四. 计算属性

• computed
• 案例一: firstName+lastName
• 案例二: books -> price