什么是vue的生命周期？

new Vue（新建一个实例）

初始化事件和生命周期

beforeCreate

初始化注入（data props methods）和校验

created

是否有el，没有调用$mount,将其转成template

是否有template，没有将el外部的html转为template，有了之后，将template转成render

beforeMount

创建vm.$el

mounted

当data修改时，会触发beforeUpdate和updated

beforeDestory

解除绑定，销毁子组件

destoryed

什么是mvvm？

见 note.youdao.com/s/AutY2Fed

vue-router如何使用？

具体见：http://note.youdao.com/s/FYFzfp17

引入步骤

• 注册vueRouter
• 定义路由规则
• 创建路由对象（并传入路由规则）
• 导出
• 在vue实例中注册上】

动态路由要注意的一个点

可通过组件的prop来接收url里的动态参数

$route,$router的区别

$route是路由规则

$router是路由对象，存储了路由的相关配置, 可通过currentRoute获取当前路由规则

vue-router有几种钩子？

3种，全局的、组件的、单个路由独享的

全局

• router.beforeEach
• router.beforeResolve （在 beforeEach 和 组件内beforeRouteEnter 之后，afterEach之前调用。）
• router.afterEach

单个路由的

cont router = new VueRouter({
    routes: [
        {
            path: '/file',
            component: File,
            beforeEnter: (to, from ,next) => {
                // do someting
            }
        }
    ]
});

组件的

const File = {
    template: `<div>This is file</div>`,
    beforeRouteEnter(to, from, next) {
    	
    },
    beforeRouteUpdate(to, from, next) {
        // do someting
        // 在当前路由改变，但是依然渲染该组件时（即组件复用）调用
    },
    beforeRouteLeave(to, from ,next) {
    
    }
}

完整的导航解析流程：

1、导航被触发
2、在失活的组件里调用离开守卫
3、调用全局的 beforeEach 守卫
4、在重用的组件里调用 beforeRouteUpdate 守卫
5、在路由配置里调用 beforEnter
6、解析异步路由组件
7、在被激活的组件里调用 beforeRouteEnter
8、调用全局的 beforeResolve 守卫
9、导航被确认
10、调用全局的 afterEach 钩子
11、触发 DOM 更新
12、在创建好的实例调用 beforeRouteEnter 守卫中传给 next 的回调函数

路由懒加载

见官网：https://router.vuejs.org/zh/guide/advanced/lazy-loading.html#%E6%8A%8A%E7%BB%84%E4%BB%B6%E6%8C%89%E7%BB%84%E5%88%86%E5%9D%97

vue-loader有什么作用？

解析和转换.vue文件。提取出其中的逻辑代码 script,样式代码style,以及HTML 模板template，再分别把他们交给对应的loader去处理

vue里的data为什么是返回一个函数？

组件中的data写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。而单纯的写成对象形式，就使得所有组件实例共用了一份data，就会造成一个变了全都会变的结果。

v-if v-for哪个先执行

v-for

所以循环时，最好先对v-if里的条件做过滤

vue如何检测数组变化

vue3种是可以检测到的，

vue2需要使用vue.set，或者使用 splice，caoncat等修改数组

delete和Vue.delete删除数组的区别

见 zhuanlan.zhihu.com/p/80601923

vue-router与location.href的用法区别

• vue-router使用pushState进行路由更新，静态跳转，页面不会重新加载；location.href会触发浏览器，页面重新加载一次

• vue-router使用diff算法，实现按需加载，减少dom操作

• vue-router是路由跳转或同一个页面跳转；location.href是不同页面间跳转；

• vue-router是异步加载this.$nextTick(()=>{获取url})；location.href是同步加载

vue-router里的query，param有什么区别？

• 使用params传参只能用name来引入路由，即push里面只能是name:’xxxx’,不能是path:’/xxx’,因为params只能用name来引入路由，如果这里写成了path，接收参数页面会是undefined！！！。

使用query传参使用path来引入路由。

• params是路由的一部分,必须要在路由后面添加参数名。query是拼接在url后面的参数，没有也没关系。
• 二者还有点区别，直白的来说query相当于get请求，页面跳转的时候，可以在地址栏看到请求参数，而params相当于post请求，参数不会再地址栏中显示。