## 一. Vue核心小知识点(可以留言互动回答~简单)
1. vue中 key 值的作用
2. vue中子组件调用父组件的方法
3. vue等单页面应用及其优缺点
## 二. `v-show`和`v-if`指令的共同点和不同点?
* `v-show`指令是通过修改元素的displayCSS属性让其显示或者隐藏
* `v-if`指令是直接销毁和重建DOM达到让元素显示和隐藏的效果
## 三. 如何让CSS只在当前组件中起作用?
将当前组件的`<style>`修改为`<style scoped>`
## 四. `<keep-alive>``</keep-alive>`的作用是什么?
`<keep-alive>``</keep-alive>` 包裹动态组件时,会缓存不活动的组件实例,主要用于保留组件状态或避免重新渲染。
大白话: 比如有一个列表和一个详情,那么用户就会经常执行打开详情=>返回列表=>打开详情…这样的话列表和详情都是一个频率很高的页面,那么就可以对列表组件使用`<keep-alive>``</keep-alive>`进行缓存,
这样用户每次返回列表的时候,都能从缓存中快速渲染,***而不是重新渲染***
## 五. Vue中引入组件的步骤?
1. 采用ES6的`import ... from ...`语法
或
CommonJS的`require()`方法引入组件
2. 对组件进行注册,代码如下
~~~
注册
Vue.component('my-component',
{ template: '<div>A custom component!</div>'})
~~~
3. 使用组件`<my-component>``</my-component>`
## 六. 指令v-el的作用是什么?
提供一个在页面上已存在的 `DOM` 元素作为 `Vue` 实例的挂载目标.可以是 `CSS` 选择器,也可以是一个 `HTMLElement` 实例,
## 七. 在Vue中使用插件的步骤
1. 采用ES6的`import ... from ...`语法
2. 使用全局方法`Vue.use( plugin )`使用插件,可以传入一个选项对象
`Vue.use(MyPlugin, { someOption: true })`
## 八. 请列举出3个Vue中常用的生命周期钩子函数?
1. ***created***: 实例已经创建完成之后调用,在这一步,实例已经完成数据观测, 属性和方法的运算, watch/event事件回调. 然而, 挂载阶段还没有开始, `$el`属性目前还不可见。
2. ***mounted***: el被新创建的 `vm.$el` 替换,并挂载到实例上去之后调用该钩子。如果 root 实例挂载了一个文档内元素,当 mounted 被调用时 `vm.$el` 也在文档内。
3. ***activated***::`keep-alive`组件激活时调用。
## 九. 请简述下Vuex的原理和使用方法
![](https://box.kancloud.cn/37efe92109ba77a94e9fa6df6939809d_663x428.png)
数据单向流动
一个应用可以看作是由上面三部分组成: ***View, Actions,State***,数据的流动也是从**View => Actions => State =>View** 以此达到数据的单向流动。
但是项目较大的, 组件嵌套过多的时候, 多组件共享同一个State会在数据传递时出现很多问题.Vuex就是为了解决这些问题而产生的。
Vuex可以被看作项目中所有组件的数据中心,我们将所有组件中共享的State抽离出来,任何组件都可以访问和操作我们的数据中心。
Vuex的组成:一个实例化的`Vuex.Store`由**state**, **mutations**和**actions**三个属性组成:
* state中保存着共有数据
* 改变state中的数据有且只有通过**mutations**中的方法,且**mutations**中的方法必须是同步的。
* 如果要写异步的方法,需要些在**actions**中, 并通过**commit**到**mutations**中进行state中数据的更改.