回顾Vue2---②

续上
三、
侦听器
这个功能用来侦听数据的变化，并以此做出对应的操作
example：

const vm = new Vue({
 el:'#app',
 data:{
 user:'',
 },
 watch:{
 user(newVal,oldVal){
 console.log(newVal,oldVal)
 }
 }
 })

newVal为user的修改后的新值，oldVal为旧值
要侦听哪个数据，函数名就为对应的数据名。

函数里加immdiate:true可以在视图渲染成功后马上触发一次侦听器（不设置的话默认初次加载页面时不会触发）

如果侦听的是个对象的话

data:{
array:{first:'1'},
},
watch:{
array:{
//handler为默认触发函数
handler(newVal){
console.log(newVal.first)
},
deep:true,
}
}

又或者直接把watch下面的array改成’array.first’，然后可以直接获取newVal

四、
vue-cli
这是Vue.js一个标准开发工具，能够简化webpack配置过程。
1.安装
npm install -g @vue/cli
2.创建项目
vue create 项目名称

在工程化项目中，主要就是通过main.js 将App.vue的内容渲染到index.html
App.vue用来编写待渲染的模板结构
index.html中预留el的位置
main.js负责将App.vue渲染到index.html