目前有個需求是這樣的，點選確定按鈕或鍵盤迴車時執行操作，很多地方都需要用到。

試了幾種方法均不行，

首先，我在div（button也一樣）上 繫結@keyup.enter方法，完全沒效果，然後按照網上的方法，這樣寫：

<div class="btn submit" @keyup.enter="submit" @click="submit">確定（Ent）</div>

created(){
   document.onkeydown = function(e) {
     if(e.keyCode == 13){
       console.log("呼叫需要執行的方法"); 
     }
   }
 },

這樣確實可以實現回車事件，但是這是全域性的，也就是說，你在其他元件回車時也會呼叫此處的回車事件，此方法不行。

然後我是這樣做的：

1.在確定按鈕和取消按鈕中間添加個<input>QqUbwNc標籤（放在中間可以當按鈕的間隔，就不用寫margin-left了），然後給這個input標籤加上@keyup.enter事件；

<template slot="footer">
        <div class="dialog-footer dis-flex">
          <div class="btn cancel" @click="showDialog = false">取消（Esc）</div>
          <input
            type="text"
            ref="inputdata"
            class="hid
 
denIpt"
            @keyup.enter="submit"
          />
          <div class="btn submit" @click="submit">
            確定（Ent）
          &lt;/div>
        </div>
</template>

2.寫個監聽器，監聽到彈窗開啟時，給input框自動聚焦（ inputdata 是 input 上用 ref 繫結的）。

watch: {
    showDialog() {
      if (this.showDialog) {
        //this.$refs.inputdata.focus(); 錯誤寫法
        this.$nextTick(() =&http://www.cppcns.com
 
gt; {//正確寫法
          this.$refs.inputdata.focus();
        });
      }
    },},

3.隱藏input框（設定寬度用來當確定按鈕和取消按鈕之間的間隔。）

.hiddenIpt {
    width: 2rem;
    opacity: 0;
  }

就這樣完美解決，有更好的辦法，歡迎溝通交流。

總結

本篇文章就到這裡了，希望能夠給你帶來幫助，也希望您能夠多多關注我們的更多內容！