本系列旨在给初级/中级前端科普vue面试题，大佬们的面经贴有很多，但是都是由于篇幅问题，回答得基本都是点到为止，而我们只知道浅尝辄止去背，面试官刚问题，刚开始是倒背如流，一旦面试官追问、展开讨论便起来哑口无言，实属尴尬。
所以本系列是基于大家烂熟于心的基本面试题的情况下，进行追问、反思、拓展
组件间如何进行通信
1. Vuex(当然也有其他好的状态管理库)
-
拓展: 举例几个不同的状态管理库?
-
拓展: commit,dispatch使用语法?
-
5大模块: Getter,Modules,Actions,Mutations,State的各个提问
-
追问1: 在Actions,Mutations里面分别做的事情有什么不一样?
答案：mutations用于同步状态的修改，actions用于执行异步操作并间接修改状态 -
追问2: 如果我在mutations里面执行异步操作可以吗？答案：其实是可以的！页面数据会跟着改，但是在devtools里面数据不会发生变化，并且f12的控制天会有warming。 这就是追问1的意义！ actions用来专门处理异步，里面触发mutations，就可以很清楚的看到mutation是何时被记录下来的，并且立即查看他们对应的状态。 -
追问3: Vuex为什么要模块化?什么是nameSpaced
答案:vuex是一个难以维护的状态树，如果在复杂的项目里面不分modules，只有一个store，便变得难以维护。 进行模块管理之后，就可以精准地往项目所属模块拉屎!(说实话Vuex的语法挺混乱的，每次使用都要翻笔记) -
追问4: Vuex的缺点是什么?有什么替代方法?
除了上面第一点说的之外，Vuex也是较为庞大的，并且对ts支持的不友好，没有代码提示，可以使用Vite+Vue3进行解决，也可以用vuex-module-decorators去进行类型支持。 -
追问5: Vuex既然不是那么轻便的插件，那如果项目是比较小型，需要使用轻便的状态管理库，你又应该怎么做？
2. props和$emit
- 反思1 : 这个写法是什么?
this.$emit("update:hidden", false);
答案 : .sync语法
- 反思2 : 怎么实现双向绑定?
3. ref和$refs
直接拿到实例去获取数据或者触发事件
4. eventBus事件总线($emit,$on)
重点:需要在main.js注册eventBus才可以使用
5. $parent和$children
-
盲点:
$parent得到的是对象,$children得到的是数组 -
反思1:
$root得到的是什么 -
反思2: 在根组件#app上用
$parent得到的是什么?
答案2: new Vue()
- 反思3: 那如果在
new Vue()的基础上在获取$parent得到的是?
答案3: undefined
6. 依赖注入(provide,inject)
provide/ inject 是vue2.2.0新增的api, 简单来说就是父组件中通过provide来提供变量, 然后再子组件中通过inject来注入变量。
但是需要注意的是provide之后的数据不是响应式的
7. $attrs和$listeners
在vue2.4中，为了解决该需求，引入了$attrs 和$listeners ， 新增了inheritAttrs 选项。 在版本2.4以前，默认情况下,父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外)，将会“回退”且作为普通的HTML特性应用在子组件的根元素上。
- 盲点:隔代传值
反思总结：
- 以上列举的这么多种方法，哪些只能够进行父子通信?哪些不但能够进行父子通信，甚至能够进行兄弟通信、爷孙通信？
