【无标题】

01 vue组件之间通信方式

1.组件传参的各种方式

2.组件常用方式有以下8种

props
$emit / $on
$children / $parent
$attrs / $listeners
ref
$root
eventbus
vuex

注意 ：
vue3种废弃的几个api
children listeners eventbus

02 v-for 和 v-if 比较优先级

1.实践中，v-for 和 v-if 是不能放一起的。
2.在vue2中，v-for 的优先级高于 v-if。如果把他们放一起，输出的渲染函数中可以看出会先执行循环再执行判断条件。哪怕是只遍历一部分元素，也得在每次渲染的时候遍历整个列表，会比较浪费。 而需注意的是 在vue3中则完全相反，v-if的优先级会高于 v-for。 所以会导致的情况就是 v-if在执行时，它调用的变量还不存在，就会导致异常。
3.有两种场景会导致我们这么写：

1.为了过滤列表中的数据
例如： v-for= “w in wList” v-if=“w.isActive”
此时定义一个计算属性：activeW,让其返回过滤后的列表即可（比如 w.filter(t=>t.isActive))
2.为了避免渲染本应该隐藏的列表
可以在外面包一层 template 即可

4. vue官方文档 (最新文档vue3明确指出) 永远不要把 v-for 和 v-if 放在同一个元素上
5. 源码 关于代码这部分，能够清晰的看到两个的优先级，总之不能把它们写在一起了。

03 简述vue的生命周期以及每个阶段做的事情

思路
1.给出概念

每个vue组件实例被创建后都会经过一系列初始化步骤。比如：它需要数据观测，模板编译，挂载实例到dom上，以及数据变化时更新dom。这个过程中会运行叫做生命周期钩子的函数，以便用户在特定阶段有机会添加他们自己的代码。

2.列举生命周期各个阶段

vue生命周期分为8个阶段。
创建前后，载入前后，更新前后，销毁前后。以及一些特殊场景的生命周期，vue3中新增了是三个用于调试和服务端渲染场景。

特殊场景下的生命周期

3.阐述整体流程
结合官方文档 生命周期流程图解 看
4.结合实践

5.扩展 ： vue3 的变化

04 v-model

1.给出双向绑定定义
2.双绑带来的好处
3.在哪使用的双绑
4.使用的方式，使用细节，vue3变化
5.原理实现描述

05 vue中如何扩展一个组件

1.按照逻辑扩展和内容扩展来举例。
逻辑扩展： mixins , extends , composition api
内容扩展 slots
2.分别说出它们使用的方法，场景差异和问题
3.作为扩展，还可以说说vue3中新引入的composition api带来的变化

06 子组件可以直接改变父组件中的数据么，说明原因

实践中，组件化开发过程中遵循 单项数据流 原则，文档明确指出。

07 vue要做权限管理该怎么做？控制到按钮级别的权限这么做

分析：

1.一般需求为两个：页面权限和按钮权限，从这两个方面论述即可。

2.具体实现的时候分后端和前端两种方案

1.前端：会把所有路由信息在前端配置，通过路由守卫要求用户登录，用户登录后根据角色过滤出路由表。比如我会配置一个 asyncRoutes 数组，需要认证的也没在其路由的meta
中添加一个roles字段，等获取用户角色之后取两者的交集。若结果不为空则说明可以访问。此过滤过程结束，剩下的路由就是该用户能访问的页面，最后通过
router.addRoutes(accessRoutes) 方式动态添加路由即可。
2.后端： 会把所有的页面路由信息存在数据库中，用户登录的时候根据其角色查询得到其他访问的所有页面路由信息返回给前端，前端再通过 addRoutes 动态添加路由信息
3.按钮权限的控制 会实现一个指令 。 例如 v-permission 或者 v-auth ,将按钮要求角色通过传值给v-permission 指令，在指令的 mounted
钩子中可以判断当前用户角色和按钮是否存在交集。有则保留按钮，无则移除按钮。

3. 虽然前端方案的优点实现简单，不需要额外的权限管理页面。但维护起来问题比较大，只要一旦有了新角色和新页面，就得重新修改前端代码以及重新打包部署。服务端方案就不会存在这个问题，通过专门的角色和权限管理页面，配置页面和按钮权限信息到数据库，应用每次登录时都是最新的路由信息。
   
   

08 说一说你对vue的响应式的理解