前端框架及项目面试 vue使用
1.vue的基本使用
模板（指令、插值）
指令、动态属性
v-html：会有XSS风险，会覆盖子组件
computed：有缓存，data不变，则不会重新计算
watch如何深度监听？
watch监听引用类型，拿不到oldVal
class和style
2.条件渲染
v-if v-else的用法，可使用变量，也可以使用===表达式
v-show
如何遍历对象？——也可以用v-for
key 的重要性，key不能乱写，但是必须得有（如random或者index）
v-for和v-if不能一起使用
3.事件
event 参数，自定义参数，是原生的，事件被挂载到当前元素
4.事件修饰符
v-on：click.stop=“doThis” 阻止单击事件继续传播
v-on: submit.prevent=“onSubmit” 提交事件不在重载页面
v-on：click.stop.prevent=“doThat” 修饰符可以串联
v-on：submit.prevent 只有修饰符
v-on：click.capture=“doThis” 添加事件监听器时使用事件捕获模式，就是内部元素触发的事件现在此处理，然后才交由内部元素进行处理
v-on：click.self=“doThat” 只当在event.target是当前元素自身时触发处理函数，就是事件不是从内部元素触发的
5.按键修饰符
@click.ctrl=“onClick” 即使Alt或shift 被同一按下时也会触发
@click.ctrl.exact=“onCtrlClick” 有且只有Ctrl被按下的时候才触发
@click.exact=“onClick” 没有任何系统修饰符被按下的时候才触发
6.表单
v-model
常见表单项 textarea CheckBox radio select
修饰符 lazy number trim
7.Vue组件的使用
props和$emit 父组件到子组件传递一个信息
组件间通讯-自定义事件
组件的生命周期
7.1生命周期（单个组件）
- 挂载阶段
- 更新阶段
- 销毁阶段
生命周期（父子组件）
index（组件）
input（组件）
List（组件）
8.Vue高级特性
不是每个都很常用，但用到的时候必须要知道
自定义 v-model
$nextTick
:data改变之后，dom不会立刻渲染，nextTick待DOM渲染完在回调，页面渲染时会将data的修改做整合，多次data修改只会渲染一次
slot 动态、异步组件：
基本使用：作用域插槽，具名插槽
动态组件： :is="component-name"用法
需要根据数据，动态渲染的场景，及组件类型不确定
异步组件：
import（）函数
按需加载，异步加载大组件
如何缓存组件
keep-alive
频繁切换，不需要重复渲染
Vue常见性能优化
mixin
多个组件有相同的逻辑，抽离出来
mixin并不是完美的解决方案，会有一些问题
- 变量来源不明确，不利于阅读
- 多mixin可能会造成命名冲突
- mixin和组件可能出现多对多的关系，复杂度较高
vue3提出的Composition API旨在解决这些问题
9.Vuex使用
用于vue组件
dispatch
commit
mapState
mapGetters
mapActions
mapMutations
10.vue-router路由模式
hash模式（默认），如http://abc.com/#/user/10
H5 history模式，如 http://abc.com/user/20
后者需要server端支持，因此无特殊需求可选择前者
Vue-router路由配置 动态路由Vue-router路由配置 懒加载
11.Vue使用-总结
基本使用，组件使用
高级特性
Vuex和 Vue-router使用