Vue中鼠标悬浮切换图片src

需求：1. 鼠标悬浮到图示按钮上面，图片切换成灰色按钮
           2. 鼠标离开图示按钮，图片切换成回白色按钮

Html部分：

  
  保存模板


  
  删除选中行


  
  清空当前表格

Js部分：

// 在data中先定义图片的初始src
saveTemplateSrc: require("@/assets/dataBrowser/saveTemplate.png"),
deleteSelectStockSrc: require("@/assets/dataBrowser/deleteSelectedRow.png"),
deleteTableDataSrc: require("@/assets/dataBrowser/clearCurrentList.png")

// 在methods中绑定鼠标悬浮事件
changeImageSrc (key, way) {
  let tempStr = way === 'hover' ? 'Hover' : ''
  switch (key) {
    case 1:
      this.saveTemplateSrc = require(`@/assets/dataBrowser/saveTemplate${tempStr}.png`)
      break
    case 2:
      this.deleteSelectStockSrc = require(`@/assets/dataBrowser/deleteSelectedRow${tempStr}.png`)
      break
    case 3:
      this.deleteTableDataSrc = require(`@/assets/dataBrowser/clearCurrentList${tempStr}.png`)
      break
  }
}