寫一個雙擊事件

<span @dblclick="edit" style="cursor:pointer;" ref="element">雙擊可編輯</span>

edit(element) {
      // 獲取要編輯的文字內容
      var oldHtml = element.target.innerText;
      // 建立一個新的 input 輸入框
      var newInput = document.createElement("input");
      // 為新的 input新增屬性
      newInput.type = "text";
      newInput.value = oldHtml;
      // 清空當前元素的文字內容
      element.target.innerText = "";
      // 把新的 input 框 追加到當前元素節點中
      element.target.appendChild(newInput);
      // 設定選擇文字的內容或設定游標位置（兩個引數：start,end；start為開始位置，end為結束位置；如果開始位置和結束位置相同則就是游標位置）
      newInput.setSelectionRange(0, oldHtml.length);
      // 為新 input 框獲取焦點
      newInput.focus();
      // 為新的 input 新增失去焦點事件
      newInput.onblur = function() {
        // 判斷失去焦點時，input 框的值是否與原值相同，相同則表示沒有修改，返回原值；不同則表示有改動，返回新值
        element.target.innerText = this.value == oldHtml ? oldHtml : this.value;
      };
    },
 

ps:可用在表格內編輯任一行、任一列、任一個單元格內容