如何避免表中跨度方法的无效刷新

时间:2019-04-16 05:20:16

标签: vue.js element-ui

我创建了绑定一些数组数据的动态表。

<el-card v-for="(f, i) in arrangedflightInDay" :key="f.id" :name="f.name" class="box-card" >
     <div class="clearfix">
            <el-container>
              <el-radio :label="f.id" :key="f.id" border>&nbsp;</el-radio>
              <el-input v-model="f.flightNo"/>
              <el-input v-model="f.etdRemark" >
                <template slot="prepend">ETD:</template>
    .....
     <el-table :data="arrangedPlanInDay[i].content" :span-method="objectSpanMethod(i)"...

     </el-table>
</el-card>

......
objectSpanMethod(idx) {
  console.log(idx + '>>>>>>>>>>>')

enter image description here

问题是,每次我尝试输入ETD时,它总是会触发跨度方法。如何避免这种刷新。显然,表绑定数据的rangedPlanInDay [i] .content不会更改,但是数据f.etdRemark会更改。我试图使用标签来识别状态。但是我不知道跨度方法何时完成。

objectSpanMethod(idx) {
  console.log(idx + '>>>>>>>>>>>' + this.rowspanTag[idx])
  if (!this.rowspanTag[idx]) {
    return
  }
  return ({ row, column, rowIndex, columnIndex }) => {
    if (columnIndex === 2) {
      const _row = this.spanArrContiner[idx][rowIndex]
      const _col = _row > 0 ? 1 : 0
      return {
        rowspan: _row,
        colspan: _col
      }
    }
  }
  ...

0 个答案:

没有答案