杂七杂八的知识（动态路由、响应式丢失、双向通讯......）

1、动态路由实现（不同用户进入同一页面不同效果）

目前我用过三种：
1、最常见的一种，由后端实现，前端使用addroute配合即可，具体步骤，调取当前用户信息接口，后端返回用户权限，根据用户权限（我们提前写好路由地址，但不进行挂载），我们使用addroute动态挂载路由即可
2、v-if实现，仓库（vuex、pinia）存储用户权限，对应权限渲染对应页面组件

2、vue3响应式丢失

响应式丢失，一般出现在reactive上，只能用vue封装好的方法，列如push那些，或者改成ref
，或者再封装一层，或者用object.assign拼接对象，如果直接使用=来进行赋值，那么便会丢失响应式，ref的出现就是为了解决此类问题，ref的本质还是用reactive封装的

3、WebSocket双向通讯

websocke描述
简要概括的话就是：WebSocket是双向通讯，先建立通讯，然后服务器数据更新之后，会触发一个回调函数

4、navie-ui中to挂载对象(写样式不起作用)

当你试图在scope的style下面，利用deep更改组件库的样式时，如果不起作用，大概率就是组件挂载的位置问题，默认是不挂载到app下面的，因此用deep是不可以的，我们需要利用to，将你要用的组件，挂载到你写样式的标签下面，大概就是下面的意思

5、vue调用子组件的方法（在上级组件中调用）

这个需要利用到vue中的defineExpose方法，将子组件的方法抛出去（暴露出去），然后我们通过子组件实例即可调用，实现：
子组件中，举例子组件的checkedBoxFn方法，利用checkedBoxFn将其暴露出去
父组件中将导入的子组件利用ref实例化，在.value.方法名即可

6、vue切换路由，echarts并不会进行重新渲染

具体文章

  document.getElementById('main').setAttribute('_echarts_instance_', '')

固定写法（除了main需要换成你的容器名称），

7、判断上传文件类型

上面边上我们上传文件获得的的结果，个人不建议使用type来判断文件类型（遇到过坑），建议使用name配合endsWith方法（es6新增）来进行判断文件类型
列入：file.name.endsWith('.zip') // true