Element UI 表格删除按钮不显示的解决方法

根据代码中的逻辑,删除按钮只会在 row.summaryNamenullcolumnIndex 不等于 5 的情况下显示。如果删除按钮不显示,可以检查以下几点:

  1. 确保 handleDelete 方法正常工作,可以在方法中添加 console.log 输出来进行调试。
  2. 确保 row.summaryName 的值为 null。可以在模板中添加 {{ row.summaryName }} 来检查值是否正确。
  3. 检查 columnIndex 的值是否为期望的值。可以在模板中添加 {{ columnIndex }} 来检查值是否正确。
  4. 检查按钮的样式是否被覆盖或隐藏。可以使用浏览器开发者工具检查按钮的 CSS 样式,或者在按钮上添加 style 属性来进行调整。

如果以上方法都没有解决问题,可以提供更多的代码或相关信息,以便更详细地分析和解决问题。

<el-table-column label='操作' align='center' width='100'>
  <template slot-scope='{ row }'>
    <template v-if='row.summaryName !== null'>
      <span></span>
    </template>
    <template v-else>
      <el-button
        v-if='row.summaryName === null'
        size='mini'
        type='text'
        width='170px'
        @click='handleDelete(scope.row)'
      >
        删除
      </el-button>
    </template>
  </template>
</el-table-column>
arraySpanMethod({ row, column, rowIndex, columnIndex }) {
  if (row.summaryName === null && columnIndex !== 5) {
    if (columnIndex === 0) {
      return {
        rowspan: 1,
        colspan: 4,
      };
    }
  }
},
Element UI 表格删除按钮不显示的解决方法

原文地址: https://www.cveoy.top/t/topic/lNyn 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录