el-table组件插槽“slot-scope”

目录

一、代码展示

二、返回的数组对象不含value或者ispass,不会报错

三、插槽里面放的是要手动输入的值时


一、代码展示

javascript 复制代码
 <el-table v-loading="loading" :data="checklistList" @selection-change="handleSelectionChange">
    <el-table-column label="值" align="center" class-name="small-padding fixed-width" width="120" fixed="right">
          <template slot-scope="scope">
            <el-input v-model="scope.row.value" placeholder="请输入" clearable></el-input>
           </template>
     </el-table-column>
     <el-table-column label="通过率" align="center" class-name="small-padding fixed-width" width="120" fixed="right">
           <template slot-scope="scope">
              <el-select v-model="scope.row.ispass" placeholder="请选择" clearable>
                 <el-option v-for="(item, index) in options" :key="index" :label="item.label"  :value="item.value">
                  </el-option>
              </el-select>
           </template>
     </el-table-column>
</el-table>

二、返回的数组对象不含value或者ispass,不会报错

三、插槽里面放的是要手动输入的值时

1、返回的数据checklistList(数组)当中,每行都不含字段ispass和value时,往scope.row.value和scope.row.value 中输入值并提交,得到的每行都有ispass和value字段的数组对象。

相关推荐
王同学QaQ16 分钟前
Vue3对接UE,通过MQTT完成通讯
javascript·vue.js
华仔啊32 分钟前
基于 RuoYi-Vue 轻松实现单用户登录功能,亲测有效
java·vue.js·后端
程序员鱼皮1 小时前
刚刚 Java 25 炸裂发布!让 Java 再次伟大
java·javascript·计算机·程序员·编程·开发·代码
Asort1 小时前
JavaScript 从零开始(五):运算符和表达式——从零开始掌握算术、比较与逻辑运算
前端·javascript
一枚前端小能手1 小时前
🚀 缓存用错了网站更慢?前端缓存策略的5个致命误区
前端·javascript
艾小码1 小时前
为什么你的页面会闪烁?useLayoutEffect和useEffect的区别藏在这里!
前端·javascript·react.js
艾小码1 小时前
告别Vue混入的坑!Composition API让我效率翻倍的3个秘密
前端·javascript·vue.js
小高0071 小时前
🔍说说对React的理解?有哪些特性?
前端·javascript·react.js
烛阴1 小时前
【TS 设计模式完全指南】懒加载、缓存与权限控制:代理模式在 TypeScript 中的三大妙用
javascript·设计模式·typescript
Samsong1 小时前
JavaScript逆向之反制无限debugger陷阱
前端·javascript