Vue 十五个常见面试题（二）

本文上接 Vue十五个常见面试题（一）

---

11. 什么是路由懒加载？

懒加载也叫延迟加载，即在你需要的时候再加载，最简单的是使用ES6的箭头函数进行懒加载：

const HelloWorld = () => import("@/components/HelloWorld")

12. 解释一下什么是Vue-loader

Vue-loader就是一个加载器，能把 .vue 组件转化成JavaScript模块。

Vue 的组件模板引擎的好处：

1. 可以动态的渲染一些数据。
2. 可以直接在模板引擎中使用ES6语法和CSS预处理器less、sass等，并且提供了作用域的选择。
3. 开发阶段可以提供热加载（页面实时更新）。

13. 用过插槽吗？用的是具名插槽还是匿名插槽？

Vue 中的插槽是一个非常好用的东西，本质上是一个占位的。

插槽分三种：默认插槽（匿名）、具名插槽、作用域插槽。

匿名插槽：只要默认内容的都可以填到这里。
具名插槽：有具体的名字，填入对应的具体内容。
作用域插槽：slot-scope，示例代码如下：

<template>
    <div>
        <slot name="header" say="hello">
    </div>
</template>

<div slot="header" slot-scope="hello">
    {{hello}}
</div>

14. 说说你对Vue虚拟DOM 的理解

虚拟DOM就是以JS对象的形式去添加DOM元素，本质上是优化了diff算法（新旧DOM对比，获取差异的DOM，一次性更新到真实DOM上）。
虚拟DOM本身也有自己的缺陷，它更适合批量修改DOM。尽量不要跨层级修改DOM，设置key可以最大的利用节点。

15. 说说Vue中keep-alive 的作用

keep-alive可以将某页面存入缓存，保证不会被销毁。它提供了include和exclude两个属性，允许组件有条件的渲染。
实现原理：在created时将需要缓存vnode节点放到cache中，在渲染的时候根据name取出。

<keep-alive>
    <router-view/>
</keep-alive>