vue+elementui 的表格单元格内修改数据

cellDbClick (row, column, cell, event) {

      var that = this

          event.target.innerHTML = ''

          var cellInput = document.createElement('input')

          cellInput.value = row[column.property] ? row[column.property] : ''

          cellInput.setAttribute('type', 'text')

          cellInput.setAttribute('class', 'inputClass')

          cellInput.style = 'width:60%;margin-left:10px;padding-left:5px;border:1px solid #DCDFE6;border-radius:4px;color:#606266;height:28px;line-height:28px;'

          cell.appendChild(cellInput)

          var changeBefore = cellInput.value

          //   聚焦

          cellInput.focus()

          // 失焦事件

          cellInput.onblur = () => {

            var changeAfter = cellInput.value

            // console.log(changeBefore, changeAfter, 'changeBefore, changeAfter')

            if (changeAfter !== changeBefore) {

              var params = {

                main: row.main,

                detail: row.detail,

                type: row.type,

                quantity: cellInput.value

              }

              that.updateOne(params)  // 调接口修改数据

              cell.removeChild(cellInput)

              event.target.innerHTML = cellInput.value

              row[column.property] = cellInput.value

          }

        }

      }

    },