关于前端:elementUI中eltable绑定内容对应不上的问题

11次阅读

共计 511 个字符，预计需要花费 2 分钟才能阅读完成。

我的项目应用的 elementUI，有个页面应用的两个单选按钮来管制展现两个表格，运行的时候发现在从 A 按钮切换至 B 按钮，而后再从 B 按钮切换至 A 按钮的时候，A 表格的一些数据和 prop 绑定的内容无奈对应，不晓得是不是 v -for 的原地复用造成的，最终解决办法:
在每一列下面加上一个惟一的 key 值就能防止出现上述情况，如下退出了:key=”Math.random()”。

<el-table-column
       label="离线工夫" 
       align="center" 
       min-width="160"  
       :key="Math.random()"
       show-overflow-tooltip
       v-if="search_form.status !=='0'">
        <template slot-scope="scope">
          <div>{{scope.row.onLineFlag == true ? '' : scope.row.offLineTime}}</div>
          <div>{{scope.row.onLineFlag == true ? '' : countDates(scope.row.offLineTime)}}</div>
        </template>
      </el-table-column>

正文完