input的focus事件阻止冒泡

在写界面的时候，选中一个输入框，就会弹出一个弹窗。还需要做可清除。
在加了clearable属性之后，就遇到问题了。点击 X 图标进行清楚之后，弹窗也会打开。
注意：我这里使用的是vxe-input，一个vxe-table组件的输入框

这里的问题就是点击清除图标，@focus也进行了冒泡，执行了打开弹窗的事件。

先上代码

这里原来就是使用的@focus事件来打开弹窗，在遇到冒泡的问题之后，就想着在函数里执行
$event.stopPropagation() 来取消冒泡。但发现没有效果

最后选择使用@click.stop来打开弹窗，这时候会报错

这里最终解决是要加上.native的修饰符，监听原生的click事件，并在清除回调里使用$event.stopPropagation() 来取消冒泡