- Vue常见的指令有哪些，有什么用
- v-if:根据值得真假来进行元素的渲染，值改变时会新建或销毁元素
- v-show:根据值得真假来切换元素的显示隐藏，不会销毁元素
- v-for:基于一个数组或对象来循环渲染一个列表，vue2.0以上必须配合：key使用
- v-bind:动态的绑定一个或多个特性，简写为：
- v-on:用于监听制定元素的dom事件，绑定事件监听器，可以简写为@
- v-model:实现数据的双向数据绑定
- v-pre：跳过这个元素和它的子元素的编译过程
- v-once：只渲染元素和组件一次。随后的重新渲染，元素/组件及其所有的子节点将被视为静态内容并跳过。这可以用于优化更新性能。
- 双向数据绑定的原理
采用数据劫持结合发布者-订阅者模式的方式，
通过Object.defineProperty()来劫持各个属性的setter，getter，
在数据变动时发布消息给订阅者，触发相应的监听回调。
- 路由的跳转和传参有哪几种方式
声明式跳转：
1）通过路径跳转
<router-link :to="{path: '/home/sort/detail', query:{id: 'abc'}}">点击查看子页面</router-link>
2）通过路由名称跳转
<router-link :to="{name: 'detail', params:{id: 'abc'}}">点击查看子页面</router-link>
函数式跳转：
this.$router.push({path: '/home/sort/detail',query:{id: 'abc'}})
传参方式：
Params传参：this.$router.push({ name:'user',params: { userId: 123 }})
命名的路由，params 必须和 name 搭配使用
Query传参：<router-link :to="{path: '/home/sort/detail', query:{id: 'abc'}}">点击查看子页面</router-link>
- 组件间的通讯方式有哪些
父传子：
父组件中自定义参数
<counter-com :num="10" str="abc"></counter-com>
子组件接受参数
props:{
"num":{type:Number,default:1},
}
子传父：
父组件中自定义事件
<counter-com @setNum=”setNum”></counter-com>
Methods:{
setNum(data){
console.log(data)
}
}
子组件通过$emit方法触发事件
This.$emit(“setNum”,{name:”123”})
通过vuex传递参数
通过事件总线传递参数
- 谈一谈对路由守卫的理解（谈理解，一般就是总分总，它是什么，用在哪，有什么用，怎么用，有什么注意事项，再结合项目说明更好）
路由守卫又称导航守卫，是在进行路由跳转时触发的钩子函数，他可以进行路由的拦截和取消等操作，分为全局路由守卫，组件内路由守卫和路由独享守卫，主要用来进行某些页面的权限认证，通过确认登录信息来判断放行还是拦截，
- router.beforeEach((to,from,next)=>{
- if(to.path == '/login' || to.path == '/register'){
- next();
- }else{
- alert('您还没有登录，请先登录');
- next('/login');
- }
- })
- 谈一谈对Vuex的理解
Vuex是一种状态管理模式+库，他几种管理所有组件公用的状态，当组件的嵌套过深，难以传值时，就可以用vuex来管理公共的状态，比如需要同意确人登录状态时。
vuex中一共有五个模块 State Getter Mutation Action Module
1）state中定义数据，可以在任何组件中进行调用
this.$store.state.全局数据名称
2）Mutation是 更改store 中的状态的唯一方法，在组建中使用commit触发Mutation操作，他不能进行异步操作
3）Action是进行异步操作的模块，但是他只能通过触发mutation来更改state中的状态
this.$store.dispatch("asynAdd")
4）getter类似于vue中的computed，进行缓存，对于Store中的数据进行加工处理形成新的数据
5)modules,当数据量很大是vuex就会显得很臃肿，所以我们可以通过modules来进行模块化分割，每个模块都有单独的state、mutation、action、getter还有module
- 谈一谈对混入的理解
混入mixins，mixins是一个js对象，它可以包含我们组件中script项中的任意功能选项，当组件使用 mixins对象时所有mixins对象的选项都将被混入该组件本身的选项中来，可以提高代码的重用性，使代码易于维护。
当我们存在多个组件中的数据或者功能很相近时，我们就可以利用mixins将公共部分提取出来，通过 mixins封装的函数，组件调用他们。
当混入后的值或选项冲突时，组件本身的值会覆盖混入的值，混入的选项会比组件本身的选项更早调用
- 谈一谈对插槽的理解
在组件封装时，可以把不确定的得部分封装为插槽，调用时再再确定下来，插槽分为具名插槽和匿名插槽，匿名插槽在定义时只需要定义<slot></slot>，使用时会将组件中的值传入插槽中。
<template>
<div class="about">
<h1>This is an Children page</h1>
<!-- 定义一个默认插槽 -->
<slot></slot>
</div>
</template>
当组件内插槽大于一个时，就必须使用具名插槽，使用name制定名称
<template>
<div class="about">
<h1>This is an Children page</h1>
<!-- 给插槽加了个name属性，就是所谓的具名插槽了 -->
<slot name="one"></slot>
<slot name="two"></slot>
</div>
</template>
<template>
<div class="about">
<h1>This is an Parent page</h1>
<children>
<template v-slot:one>
<p>one插槽</p>
</template>
<template v-slot:two>
two插槽
</template>
</children>
</div>
</template>
- 什么是跨域，如何解决
浏览器的同源策略规定js的交互只能在同域中，当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域
解决:通过配置代理绕过浏览器的同源策略
- 谈一谈封装请求的心得
将axios封装在promise对象中，将需要用到的请求配置同意封装在方法里，调用请求方法后可以很方便的使用，节省了大量的代码，没有了冗余的操作，使代码整洁便于维护，提高了可读性和复用性，符合高内聚，低耦合的特点