JSON parse assigned fail

src/components/reportTemplate/ReportTemplate.vue

@@ -3,14 +3,13 @@
     <div class='empty'></div>
     <div class='content'>
       <table>
-        <tr v-for="row in rows" :key="row.rowId" :cells="row.cells">
+        <tr v-for="(row,index) in rows" :key="row.rowId" :cells="row.cells">
-          <input class='row-counter' type="button" :value='row.rowId' @click="rowClickHandler(row)">
+          <input class='row-counter' type="button" :value='index' @click="rowClickHandler(row)">
           <reportCell v-for="cell in row.cells" :cell="cell" v-on:cellIdFromChild="getCellFromChildren" :key="cell.cellId" v-bind:class="{active:cell.cellId===selectedCell}"></reportCell>
         </tr>
       </table>
     </div>
     <div class='side'>
-
       <div class='row-tool'>
         <button @click="addRow">添加行</button>
         <button @click="deleteRow">删除行</button>
@@ -22,24 +21,18 @@
       <div>
 
         <label>表头:</label><input type="text" v-model="inputTitle"><br>
-
         <label>宽度:</label><input type="number" v-model="inputColspan"><br>
-
         <label>高度:</label><input type="number" v-model="inputHeight"><br>
         <label>字体大小:</label><input type="number" v-model="fontSize"><br>
-
         <label>字体样式:</label>
         <input type="radio" id="styleone" value="normal" v-model="fontStyle">
         <label for="styleone">正常</label>
-
         <input type="radio" id="styletwo" value="bold" v-model="fontStyle">
         <label for="styletwo">加粗</label>
         <br>
-
         <label>字体位置:</label>
         <input type="radio" id="one" value="left" v-model="textAlign">
         <label for="one">居左</label>
-
         <input type="radio" id="two" value="center" v-model="textAlign">
         <label for="two">居中</label>
         <input type="radio" id="three" value="right" v-model="textAlign">
@@ -48,8 +41,7 @@
         <button @click="undoHandler">undo</button>
         <button @click="redoHandler">redo</button><br>
         <div>
-          <p style="
+          <p style="color: blue">以下功能用于测试使用</p>
-    color: blue">以下功能用于测试使用</p>
           <!-- <button @click="importTemplate">导入设计模板</button> -->
           <button @click="importTemplate">导入设计样式</button>
           <button @click="importData">导入数据</button><br>
@@ -57,9 +49,8 @@
           <span>{{selectedCell}}</span><br>
           <label>行ID:</label>
           <span>{{selectedRow}}</span><br>
-
         </div>
-
+        {{this.infos}}
       </div>
     </div>
   </div>
@@ -97,6 +88,7 @@ let cellId = 9025;
 const initialInputColspan = 0;
 const initialInputHeight = 30;
 let undoRodoPointer = -1;
+let undoOrRedo = false;
 export default Vue.extend({
   components: { reportCell },
   data() {
@@ -133,10 +125,18 @@ export default Vue.extend({
       }
 
       if (
+        undoOrRedo === false &&
         this.recordHistory[this.recordHistory.length - 1] !==
           JSON.stringify(this.infos)
       ) {
         this.recordHistory.push(JSON.stringify(this.infos));
+
+        // console.log(
+        //   'computed 长度',
+        //   this.recordHistory,
+        //   '长度',
+        //   this.recordHistory.length,
+        // );
       }
 
       return this.infos;
@@ -165,7 +165,7 @@ export default Vue.extend({
         for (const index in this.infos) {
           if (this.selectedRow === this.infos[index].rowId) {
             this.infos.splice(Number(index), 0, {
-              rowId: (this.selectedRow += 0.1),
+              rowId: (this.selectedRow += 1),
               cells: [],
             });
             this.selectedRow = 0;
@@ -222,16 +222,25 @@ export default Vue.extend({
       if (undoRodoPointer < 0) {
         undoRodoPointer = this.recordHistory.length - 1;
       }
+      // console.log('总长度', this.recordHistory.length, '指针', undoRodoPointer);
+      //  赋值不成功
       this.infos = JSON.parse(this.recordHistory[undoRodoPointer - 1]);
-      undoRodoPointer -= 1;
+
+      console.log(JSON.parse(this.recordHistory[undoRodoPointer - 1]));
+
+      console.log(this.infos);
+
+      undoOrRedo = true;
     },
 
     redoHandler() {
       if (undoRodoPointer < 0) {
         undoRodoPointer = this.recordHistory.length - 1;
       }
-      this.infos = JSON.parse(this.recordHistory[undoRodoPointer + 1]);
+      //  console.log('总长度', this.recordHistory.length, '指针', undoRodoPointer);
-      undoRodoPointer += 1;
+
+      this.infos = JSON.parse(this.recordHistory[(undoRodoPointer += 1)]);
+      undoOrRedo = true;
     },
     importData() {
       for (const row of this.infos) {