vue常见问题

  1.v-if和v-show的区别？

都可以控制元素的显示和隐藏

1).v-show时控制元素的display值来让元素显示和隐藏；

v-if显示隐藏时把DOM元素整个添加和删除

2).v-if有一个局部编译/卸载的过程，切换这个过程中会适当的销毁和重建内部的事件监听和子组件；v-show只是简单的css切换

3).v-if才是真正的条件渲染；v-show从false变成true的时候不会触发组件的声明周期，v-if会触发声明周期

 4.v-if的切换效率比较低  v-show的效率比较高

    2.如何理解MVVM的？

        是Model-View-ViewModel的缩写。前端开发的架构模式

        M：模型，对应的就是data的数据

        V：视图，用户界面，DOM

        VM：视图模型：Vue的实例对象，连接View和Model的桥梁

    核心是提供对View和ViewModel的双向数据绑定，当数据改变的时候，ViewModel能监听到数据的变化，自动更新视图，当用户操作视图的时候，ViewModel也可以监听到视图的变化，然后通知数据进行改动，这就实现了双向数据绑定

   ViewModel通过双向绑定把View和Model连接起来，他们之间的同步是自动的，不需要认为干涉，所以我们只需要关注业务逻辑即可，不需要操作DOM，同时也不需要关注数据的状态问题，因为她是由MVVM统一管理

3.vue的双向数据绑定原理是什么？

        通过数据劫持和发布订阅者模式来实现，同时利用Object.defineProperty()劫持各个属性的setter和getter，

        在数据发生改变的时候发布消息给订阅者，触发对应的监听回调渲染视图，也就是说数据和视图时同步的，数据发生改变，视图跟着发生改变，视图改变，数据也会发生改变。

        第一步：需要observer的数据对象进行递归遍历，包括子属性对象的属性，都加上setter和getter

        第二步：compile模板解析指令，把模板中的变量替换成数据，然后初始化渲染视图，同时把每个指令对应的节点绑定上更新函数，添加订阅者，如果数据变化，收到通知，更新视图

        第三步：Watcher订阅者是Observer和Compile之间的通信桥梁，作用：

                1.在自身实例化的时候忘订阅器内添加自己

                2.自身要有一个update()方法

                3.等待属性变动时，调用自身的update方法，触发compile这种的回调

        第四步：MVVM作为数据绑定的入口，整合了observer、compile和watcher三者，通过observer来监听自己的数据变化，通过compile解析模板指令，最后利用watcher把observer和compile联系起来，最终达到数据更新视图更新，视图更新数据更新的效果

    4.v-for中的key值的作用是什么？

        key属性是DOM元素的唯一标识

        作用：

            1.提高虚拟DOM的更新

            2.若不设置key，可能会触发一些bug

            3.为了触发过度效果

    4.说一下你对vue生命周期的理解。

        组件从创建到销毁的过程就是它的生命周期

        创建   beforeCreat    在这个阶段属性和方法都不能使用

              created  这里时实例创建完成之后，在这里完成了数据监测，可以使用数据，修改数据，不会触发updated，也不会更新视图

        挂载 beforeMount 完成了模板的编译，虚拟DOM也完成创建，即将渲染，修改数据，不会触发updated

            Mounted把编译好的模板挂载到页面，这里可以发送异步请求也可以访问DOM节点

        更新 beforeUpdate组件数据更新之前使用，数据是新的，页面上的数据时旧的，组件即将更新，准备渲染，可以改数据

            updated  ,render重新做了渲染，这时数据和页面都是新的，避免在此更新数据

        销毁

            beforeDestroy 实例销毁前，在这里实例还可以用，可以清楚定时器等等

            destroyed组件已经被销毁了，全部都销毁

        使用了keep-alive时多出两个周期：

            activited组件激活时             deactivited组件被销毁时

    5.在created和mounted去请求数据，有什么区别？

        created：在渲染前调用，通常先初始化属性，然后做渲染

        mounted：在模板渲染完成后，一般都是初始化页面后，在对元素节点进行操作

                在这里请求数据可能会出现闪屏的问题，created里不会

        一般用created比较多

        请求的数据对DOM有影响&