element怎么隐藏某一列中的一项按钮?

如图:想把前两个删除按钮隐藏,但是最后一个不隐藏,页面结构如下怎么写?

      <el-table-column label="操作" width="200%">
        <template scope="scope">
          <el-button size="small" @click="handleEdit(scope.$index, scope.row)">分配菜单</el-button>
          <el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
        </template>
      </el-table-column>

clipboard.png

阅读 5.2k
1 个回答

这个按钮的显隐也直接绑定在data里面,在button上面用v-show="scope.row.allowDelete控制


补充:

你的表单数据应该是类似的结构

let tableData = [
    {
        name:"123",
        number:123,
    },
    {
        name:"456",
        number:456,
    }
]

你可以将其补充为

let tableData = [
    {
        name:"123",
        number:123,
        allowDelete:true,
    },
    {
        name:"456",
        number:456,
        allowDelete:false,
    }
]

然后在slot里,<button v-show="scope.row.allowDelete">删除</button>

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题