• 現(xiàn)象：
  點(diǎn)擊按鈕后，如果不再點(diǎn)擊別的地方，按鈕不會(huì)失焦，一直有顏色~

  
  
  不失去焦點(diǎn)問(wèn)題.png

解決：

1、 建立 v-btn

// src/directives/btn.js
export default {
    install: (app) => {
      const fun = function (evt) {
        let target = evt.target
        if (target.nodeName == 'SPAN') {
          target = evt.target.parentNode
        }
        target.blur()
      }
      app.directive('btn', {
        mounted(el) {
          el.addEventListener('focus', fun)
        },
        unmounted(el) {
          el.removeEventListener('focus', fun)
        }
      })
    }
  }

2、main.js中注冊(cè) 全局使用

import btn from "@/directives/btn";
const app = createApp(App)
app.use(btn)

3、用到的地方添加v-tbn即可。

<el-button
        v-btn
         :class="likeButtonClass"
         @click="likeMessage"
         >{{ $t('mesage.like') }}
</el-button>

參考鏈接