1. Vue的原理是什么?
Vue的响应式原理是核心是通过Es5的保护对象的。 Object.definedProperty中的访问器属性中的get和set方法,data中声明的属性都被添加到了访问器属性,当读取data中的的数据自动调用get方法,当修改data中的数据时,自动调用set方法,检测到数据的变化,会通过观察者wacher,观察者wacher自动出发重新render当前组件,生成新的虚拟DOM树,Vue框架会遍历并对比新虚拟DOM树和旧虚拟DOM中每个结点的差别,并记录下来。最后,加载操作,将所有记录的不同点,局部修改到真是DOM树上。
2.Vue实现数据双向绑定的原理?
Vue数据双向绑定原理是通过数据劫持结合发布者-订阅者模式的方式来实现的,首先是对数据进行监听,然后当监听的属性发生变化时则告诉订阅者是否要更新,若更新就会执行对应的更新函数从而更新视图 以往的MVC模式是单向绑定,即Model绑定到View,当我们用JavaScript代码更新Model时,View就会自动更新
3.Vue的路由实现原理?
在vue中路由主要有 hash与History interface两种方式实现前端路由,单页路由的特点就是采用前端路由系统,通过改变URL,在不重新请求页面的情况下,更新页面视图。目前在浏览器环境中这一功能的实现主要有两种方式:hash和History interface
4.Vue组件的通讯?
1.父组件传子组件 单向数据流props
使用refs访问子组件
使用$parent访问父组件
使用$children访问子组件
使用$root访问当前组件树的根 Vue 实例
2.子组件传递数据给父组件: 子组件通过事件给父组件传数据,子组件通过on监听事件
3.兄弟组件间通信 ①用事件发布订阅 var bus=new vue();bus.on("id-selected",function(id){})
②用vuex来实现
5.Vuex是做什么的?
Vuex 是适用于 Vue.js 应用的状态管理库,为应用中的所有组件提供集中式的状态存储与操作,保证了所有状态以可预测的方式进行修改;
state: state 定义了应用状态的数据结构,同样可以在这里设置默认的初始状态。
actions:Actions 即是定义提交触发更改信息的描述,常见的例子有从服务端获取数据,在数据获取完成后会调用store.commit()来调用更改 Store 中的状态。可以在组件中使用dispatch来发出 Actions。
mutations: 调用 mutations 是唯一允许更新应用状态的地方。
getters: Getters 允许组件从 Store 中获取数据,譬如我们可以从 Store 中的 projectList 中筛选出已完成的项目列表
modules: modules 对象允许将单一的 Store 拆分为多个 Store 的同时保存在单一的状态树中。随着应用复杂度的增加,这种拆分能够更好地组织代码
但是vuex也有缺点就是,vuex中保存的数据是和网页的生命周期同步的,当执行页面刷新的时候vuex中所有数据都会消失复位到初始状态,所以不太适合做有分享页面的数据交互(在这种项目中vuex只适合数据的集中管理,不适合数据的存储,这种情况一般是使用路由传递参数会好一些),适合后台管理系统多一些,后台管理系统一般都是公司内部使用;