iview4 table表格 单行鼠标移入移出事件，请确定有效

在iview4版本的Table组件中，如果你想实现在单行数据上添加鼠标移入移出事件，你可以通过`hover-class`属性或者`on-row-contextmenu`和`on-mouseenter`、`on-mouseleave`自定义事件来达到这个效果。

`hover-class`是一个字符串，当鼠标悬停在指定行上时，该类会被添加到行元素上。例如：

<template>
  <Table :data="tableData" hover-class="row-hover">
    <TableColumn field="name" title="姓名"></TableColumn>
    <!-- 其他列... -->
  </Table>
</template>

<style scoped>
.row-hover {
  background-color: rgba(0, 0, 0, 0.1);
}
</style>

<script>
export default {
  data() {
    return {
      tableData: [
        // 数据...
      ]
    };
  }
};
</script>

如果你需要更复杂的交互，如点击后显示详细信息，可以结合`on-row-contextmenu`事件处理程序，并在其中设置`on-mouseenter`和`on-mouseleave`事件，如下所示：

<template>
  <Table :data="tableData" @row-contextmenu="handleContextMenu">
    <!-- ... -->
  </Table>
</template>

<script>
methods: {
  handleContextMenu(row) {
    const showDetail = () => {
      // 显示详细信息...
      this.$emit('row-enter', row); // 触发鼠标进入事件
    };

    // 当鼠标离开时隐藏细节信息
    const hideDetail = () => {
      this.$emit('row-leave'); // 触发鼠标离开事件
    };

    // 点击行时触发showDetail函数
    document.addEventListener('click', hideDetail);

    // 当鼠标进入行时开始监听鼠标离开
    this.$emit('row-enter', row);
  }
}
// ...其他代码
</script>

记得在适当的地方移除`document.addEventListener('click', hideDetail)`以解除鼠标离开的监听。