el-table在动态渲染列的时候,使用slot自定义单元格时,prop属性键入失效

el-table在动态渲染列的时候,使用slot自定义单元格时,prop属性键入失效

原因:使用自定义slot,循环体中所有的列都是自定义slot,即时v-if绑定在template也不行

<el-table-column
  v-for="col in dataSource.cols"
  :key="col.prop"
  :prop="col.prop"
  :label="col.label"
  :width="col.width"
  align="center"
  show-overflow-tooltip
>
  <!-- 使用自定义slot,循环体中所有的列都是自定义slot,不会默认键入prop即时v-if绑定在template也不行-->
  <template slot-scope="{ row }">
    <span
      v-if="col.prop === 'pairingDate'"
      @click="openDetailTable(row)"
      style="color: #1890ff; cursor: pointer"
      >{
    
    {
    
     row.pairingDate }}</span
    >
    <!-- 必须使用v-else,否则单元格会出现空白 -->
    <span v-else>{
    
    {
    
     row[col.prop] }}</span>
  </template>
</el-table-column>

猜你喜欢

转载自blog.csdn.net/qq_44741577/article/details/142256325