has made a requirement exactly the same as yours, and my approach is
1. When you click the edit button, get a variable to store the original form data.
this.curApiList = JSON.parse (this.form.apiListData));
2. Just restore it when you cancel the edit.
this.form.apiListData = this.curApiList;
use two values, an original value and a text box value. When modified, Synchronize will be ready
input box v-model to bind the new variable. When you click to edit, the data of the corresponding row will be assigned to the variable in turn, so that the value of table will not change. When canceled, input is hidden, left blank, and table displays the previous value. If saved, the table data will be changed
when you don't need two-way binding.
v-model is a syntax sugar =: value + @ input;.
here you can take it apart
write all the values bound by input to the value entered by the object Object, for the first time, because two-way binding will send Synchronize into this object, use the es6 method Object.assign () to make a copy and keep it, and when the input box is modified again, the last value will still be retained. If necessary, you can re-assign the past
encountered the same problem
Hello, have you solved this problem? I have encountered the same problem, but I can't think of a good solution