打开新页面el-dropdown不消失 解决方法

一、问题描述

页面A中包含列表数据，每条列表最后一栏【更多】是el-dropdown实现的下拉框，点击其中一项，路由跳转到页面B。
问题 ：跳转页面B后，发现页面A中的el-dropdown内容，有时会在页面左上角一直显示。如下图：

页面B左上角，显示页面A的dropdown元素：

二、解决办法:

1. 在页面A，给dropdown组件设置一个class类名，便于后续操作：
   
2. 在页面B created周期中，手动将所有dropdown元素隐藏/移除 （因为我这里是嵌套在micro-app中不便移除，所以采用的隐藏）：
   

Tips：

如果想要 路由跳转时 全局隐藏/删除所有dropdown元素，可以如下操作：

1. 使用路由守卫，监听路由跳转时 隐藏/删除；
2. 在 App.vue 中监听路由跳转；

三、问题分析

项目使用keep-alive做了组件缓存，跳转到页面B时，页面A的实例会被缓存，并不会被销毁。
其中的dropdown元素也会残留在body元素上（挂载到body是element默认行为）