持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第3天，点击查看活动详情
1.数据双向绑定原理⭐⭐⭐
答：通过数据劫持结合发布—订阅模式，通过Object.defineProperty()为各个属性定义get、set方法，在数据发生改变时给订阅者发布消息，触发相应的事件回调。
原理：Object.defineProperty()结合发布-订阅者模式，视图更新数据，数据更新视图
1、data上的数据如何绑定到页面上的
Object.defineProperty()，data进行数据劫持，设置相应的set，get属性
2、页面上的数据发生改变后如何来修改data上的数据
Object.defineProperty()的set修改原来的值,触发劫持中的set属性
数据进行监听，数据发生改变时拿到最新值然后通知data需要改变
3、data数据修改然后让页面进行修改
watch,数据发生变化执行相应的回调函数去更新数据视图
2. vue生命周期⭐⭐⭐
概念：从创建、初始化数据、编译模板、挂载DOM、渲染-更新-渲染、卸载等一系列过程，称为为Vue 实例的生命周期。
vue2.0
beforeCreate：创建前。此时，组件实例刚刚创建，还未进行数据观测和事件配置，拿不到任何数据。
created：创建完成。vue 实例已经完成了数据观测，属性和方法的计算(比如props、methods、data、computed和watch此时已经拿得到)，未挂载到DOM，不能访问到el属性，el属性，ref属性内容为空数组常用于简单的ajax请求，页面的初始化。
beforeMount：挂载前。挂在开始之前被调用，相关的render函数首次被调用（虚拟DOM）。编译模板，把data里面的数据和模板生成html，完成了el和data 初始化，注意此时还没有挂在html到页面上。
mounted：挂载完成。也就是模板中的HTML渲染到HTML页面中，此时可以通过DOM API获取到DOM节点，$ref属性可以访问常用于获取VNode信息和操作，ajax请求，mounted只会执行一次。
beforeUpdate：在数据更新之前被调用，发生在虚拟DOM重新渲染和打补丁之前，不会触发附加地重渲染过程。
updated：更新后。在由于数据更改导致地虚拟DOM重新渲染和打补丁之后调用，
beforeDestroy;销毁前。在实例销毁之前调用，实例仍然完全可用。（一般在这一步做一些重置的操作，比如清除掉组件中的定时器 和 监听的dom事件）
destroyed：销毁后。在实例销毁之后调用，调用后，vue实列指示的所有东西都会解绑，所有的事件监听器会被移除。
其他：
activated：在keep-alive组件激活时调用
deactivated：在keep-alive组件停用时调用
详情可看vue2.0官网生命周期钩子
vue3.0
onBeforeMount
onMounted
onBeforeUpdate
onUpdated
onBeforeUnmount
onUnmounted
详情可看vue3.0官网生命周期钩子
3.组件之间如何传值⭐⭐⭐
一、Vue父子 组件之间传值
子组件通过props来接受数据和通过$emit来触发父组件的自定义事件；
二、兄弟组件之间的传值
建一个公共组件bus.js.。传递方通过事件触发bus.on。
三、可以通过VUEX 来跨组件传参。
四、父孙传值 listeners（向上）
五、 祖先和子孙传值provide/inject
六、获取父组件实例this.$parent
详情可看vue之组件的传参方式
4.路由之间如何传参⭐⭐
通过router-link路由导航跳转传递
<router-link to=/a/${id}>routerlink传参
跳转时使用push方法拼接携带参数。
this.$router.push({
path: /getlist/${id},
})
通过路由属性中的name来确定匹配的路由，通过params来传递参数。
this.$router.push({
name: 'Getlist',
params: {
id: id
}
})
使用path来匹配路由，然后通过query来传递参数。
this.$router.push({
path: '/getlist',
query: {
id: id
}
})
注意：query有点像ajax中的get请求，而params像post请求。params在地址栏中不显示参数，刷新页面，参数丢失,其余方法在地址栏中显示传递的参数，刷新页面，参数不丢失。
5.谈一谈VUEX⭐⭐
原理：Vuex是专门为vue.js应用程序设计的状态管理工具。
构成:
state:vuex的基本数据，用来存储变量，存放的数据是响应式的。
mutations:提交更改数据，同步更新状态。
actions:提交mutations，可异步操作。
getters：是store的计算属性。
modules:模块，每个模块里面有四个属性。
