Element UI 在el-button上绑定 mouseover和mouseout事件无效

Question

想要做一个悬浮按钮的组件，在鼠标移动到按钮时展开说明按钮功能

但是，在绑定mouseover和mouseout事件时，发现绑在按钮上时无效的，只有绑在按钮上的Icon上才有效，想问问大家怎么解决

绑定在按钮上的Code：

<el-button 

type="primary" 

class="box-button"

@mouseover='btn1_show' @mouseout="btn1_close">

    <span id='btn1_title'  style="margin:0px 5px;">系统消息</span>

    <img 

    style="height:50%;margin:0px 10px"

    src="./assets/ic_remind.png">

</el-button>

绑定在Icon上的Code：

<el-button 

type="primary" 

class="box-button"

>

    <span id='btn1_title'  style="margin:0px 5px;">系统消息</span>

    <img 

    style="height:50%;margin:0px 10px"

    @mouseover='btn1_show' @mouseout="btn1_close"

    src="./assets/ic_remind.png" alt="">

</el-button>