elementUi中的popover嵌套导致弹窗不能自动关闭

问题描述：
组件A中有个弹窗el-popover，这个弹窗里面引入子组件B，B中又有弹窗el-popover，这样相当于是popover嵌套，导致的问题就是子popover中的弹窗打开第二个的时候第一个不能自动关闭，看效果：

这个问题在网上差了好久，什么‘popover嵌套导致的问题’等等啊，竟然没有一篇这个问题的文章，看来也挺冷门的，于是打算自己尝试改一下，中间的复杂过程就不说了，最后的解决方案如下：

1. 因为无论是第一级的popover，还是嵌套的，都在body上，平级显示，所以不能区分出来，给嵌套的子el-popover加ref，这样就能找到子popover。
   

2. 因为子el-popover是循环出来的，所以可以在当前的el-popover显示出来的回调中加入index参数，来决定将哪个el-popover关闭。
   

3. 获取所有循环出来的el-popover，如果这个el-popover的索引值和当前弹出的索引值相同，则不关闭，否则关闭弹窗
   
   这里使用了el-popover自带的方法doClose()。
   

4. 上面这样会导致一个问题，就是点击页面的其他地方，弹窗不会消失，同样手动关闭。在页面的最外层加上点击事件。点击的时候手动关闭。
   
   
   然后给关闭popover的方法加上取消冒泡事件。
   
   附代码：

//点击其他地方，popover消失
		tableTwoPopoverClick () {
			let eleList = this.$refs.earlyPop
			eleList.forEach((i,j)=>{
					i.doClose()
			})
			let eleList1 = this.$refs.warnyPop
			eleList1.forEach((i,j)=>{
					i.doClose()
			})
		},
		//关闭其他popover
		handleStatusWarn (index) {
			var e = window.event || arguments.callee.caller.arguments[0];
			e.stopPropagation();
			let eleList = this.$refs.warnyPop
			eleList.forEach((i,j)=>{
				if(j != index){
					i.doClose()
				}
			})
		},