vue3 实现el-table 部分行不让勾选

vue3 实现el-table 部分行不让勾选

html 复制代码
 <el-table
      ref="tableRef"
      :data="tableData"
      border
      stripe
      style="width: 100%;"
      @selection-change="handleSelectionChange"
    >
      <!-- 选择列:核心配置selectable回调 -->
      <el-table-column
        type="selection"
        width="55"
        :selectable="checkCanSelect"
      />
      <el-table-column prop="id" label="ID" width="80" align="center" />
      <el-table-column prop="name" label="名称" align="center" />
      <el-table-column prop="status" label="状态" align="center">
        <!-- 状态格式化显示 -->
        <template #default="scope">
          <el-tag :type="scope.row.status === 1 ? 'success' : 'danger'">
            {{ scope.row.status === 1 ? '正常(可选中)' : '禁用(不可选)' }}
          </el-tag>
        </template>
      </el-table-column>
    </el-table>
js 复制代码
const checkCanSelect = (row, index, column) => {
  // 自定义判断条件:status=1 可选中,否则禁止
  return row.status === 1
}
相关推荐
wuhen_n2 小时前
网络请求在Vite层的代理与Mock:告别跨域和后端依赖
前端·javascript·vue.js
小彭努力中2 小时前
193.Vue3 + OpenLayers 实战:圆孔相机模型推算卫星拍摄区域
vue.js·数码相机·vue·openlayers·geojson
用户69371750013847 小时前
Google 正在“收紧侧加载”:陌生 APK 安装或需等待 24 小时
android·前端
蓝帆傲亦7 小时前
Web 前端搜索文字高亮实现方法汇总
前端
用户69371750013847 小时前
Room 3.0:这次不是升级,是重来
android·前端·google
漫随流水8 小时前
旅游推荐系统(view.py)
前端·数据库·python·旅游
踩着两条虫9 小时前
VTJ.PRO 核心架构全公开!从设计稿到代码,揭秘AI智能体如何“听懂人话”
前端·vue.js·ai编程
jzlhll12310 小时前
kotlin Flow first() last()总结
开发语言·前端·kotlin
用头发抵命11 小时前
Vue 3 中优雅地集成 Video.js 播放器:从组件封装到功能定制
开发语言·javascript·ecmascript
蓝冰凌11 小时前
Vue 3 中 defineExpose 的行为【defineExpose暴露ref变量】详解:自动解包、响应性与实际使用
前端·javascript·vue.js