vue面试准备笔记

• 核心原理

  • MVVM

    model view viewmodel

    ​ model模型，指后端传过来的数据

    ​ view视图，指看到的页面

    ​ view model视图模型，这个模式是连接桥梁

    ​ 将后端的数据转换为可见的页面，实现方式：数据绑定

    ​ 将看到的页面转换成后端数据，实现方式：DOM事件监听

    两个方向都实现，是双向绑定

  • 双向绑定

    • 原理：

      通过object.defineProperty来劫持各个属性的setter，getter，才数据发布消息给订阅者，触发相应的监听回调

  • 生命周期函数

    • 1、beforeCreate

    • 2、created

    • 3、beforeMount

    • 4、mounted

    • 5、beforeUpdate

    • 6、updated

    • （activated） 在被keep-alive包含时会出现的生命周期钩子

      • 当再次计入缓存的路由和组件时不会触发以上生命周期钩子

    • （deactivated）在被keep-alive包含时会出现的生命周期钩子

      • 组件被停用，（离开路由）时调用，如果你缓存了组件，要在组件销毁的时候做一些事情，可以在这里，在这里不会调用一下钩子函数

    • 7、beforeDestroy

    • 8、destroyed

    • （errorCaptured）

  • 组件渲染加载的过程模板编译的过程

  • data为什么必须是一个函数

  • nextTick

  • 组件缓存

    • 使用vue内置组件

  • 插槽

• 指令相关

  • 常用的指令分别有什么含义

  • v-for中为什么要加key?

    • 在v-for更新以渲染的元素列表时，它默认用就地复用策略
    • 为了高效的更新虚拟DOM

  • v-if和v-show的区别

    • 编译的区别

      • v-if：局部编译/卸载的过程
      • v-show：控制css

    • 方法不同

    • v-if

      • 动态向DOM树添加huo删除DOM元素

    • v-show

      • 通过设置css中的display设置为none

  • v-for中的key为什么不建议使用index?

• 组件相关

  • 组件传值

  • 请说出组件传值的六种实现方式

    • 父组件向子组件传值
      • 在父组件引用子组件上绑定一个自定义属性，并把数据绑定到自定义属性
        • 在子组件添加参数props接收
    • 子组件向父组件传值