尚硅谷课程vue学习（一）

课程地址：https://www.bilibili.com/video/BV1Zy4y1K7SH?p=25&spm_id_from=pageDriver&vd_source=a402747bd6c153bdb2defee02a9cb617
https://www.bilibili.com/video/BV12J411m7MG/?spm_id_from=333.337.search-card.all.click&vd_source=a402747bd6c153bdb2defee02a9cb617

data两种写法

(1)new Vue时配置el属性
（2）先创建vue实例，然后再通过vm.$mount(‘#root’)指定el的值

el两种写法

对象式
函数式（以后会用）
data(){
return{

}
}

由vue管理的函数，一定不要写箭头函数，不然this指向windows实例了

MVVM模型

defineProperty属性

数据代理

data数据和_data数据一样

v-on: v-bind:

v-bind:单向绑定 ：
v-model：双向绑定
v-on:@
模板（原html中的），实例（data中的，也可以说是vm）

键盘事件keyup keydown

@keyup=“”

computed计算属性

vm中的 data是什么就是什么,methods是什么就是什么，但是methods需要注意选择的是返回值
computed中的get和set方法，set不是必须的

只读不改就可使用简写

监视属性watch

vue不能检测到多级变化，需要添加一个属性，

如果没有其他属性就可以进行简写

监视属性和计算属性区别

computed和watch两者不冲突
watch监视属性可以进行定时操作，过一段时间操作一次
computed靠返回值

绑定class和style属性

正常的样式正常写，变化的样式可以加：

条件渲染v-if, v-show

列表渲染

index作为键key就会出现问题，如果顺序打乱就会混乱，id作为key就会更好