插槽作用域渲染按钮开关 ~ 满满的干货哦

在一个项目中，经常会用到开关，我们就需要渲染开关。今天小编总结了以下具体的步骤，希望可以帮助到有需要的小伙伴~

文章目录

渲染开关的状态
- 通过element-ui实现按钮的样式
- 渲染按钮的步骤

渲染开关的状态

使用作用域插槽实现开关

通过element-ui实现按钮的样式

Switch开关：https://element.eleme.cn/#/zh-CN/component/switch

渲染按钮的步骤

定义一个作用域插槽，接收当前作用域的数据
通过 v-model 双向数据绑定，将数据和开关的状态关联起来

如果 mg_dtate 的值为 true，就打开开关

如果 mg_dtate 的值为 false，就关闭开关
（mg_dtate 是获取到的后台数据）
v-model 双向数据绑定，可以把数据和开关的状态关联起来

代码：

<el-table-column label="状态"><!-- slot-scope="scope" 取到作用域插槽，即 data绑定的数据 scope是可以自定义名字的，定义一个对象 来表示 取到的 data数据--><template slot-scope="scope"><!-- {{ scope.row }} 获取 “状态”这一行 所有的数据 --><!-- scope.row.mg_dtate 获取 “状态”这一行 mg_dtate 的值，为true还是false --><!-- Switch开关 --><!-- v-model 双向数据绑定 ，可以把 数据 和 开关的状态 关联起来--><el-switch v-model="scope.row.mg_dtate"> </el-switch></template></el-table-column>

如果这篇博客有错误的地方，请各位大佬批评指正。

插槽作用域渲染按钮开关 ~ 满满的干货哦相关推荐

lombok如何给属性设置_【扮家家云渲染】3Dmax干货｜模型如何打光及其属性的设置技巧...
3dmax如何对模型打灯光及其属性的设置,能让模型的阴影更细致,表现物体的真实: ①在3dmax中如果没有任何光源,场景将是漆黑一片 ②为了在没有添加灯光的情况下也可以看到场景3dmax提供了一种默认 ...
【SAP解决方案干货合集】满满的干货，是您了解华为云SAP解决方案的必备利器
[SAP解决方案干货合集]满满的干货,是您了解华为云SAP解决方案的必备利器 https://bbs.huaweicloud.com/forum/forum.php?mod=viewthread&am ...
吐血整理，Ubuntu必备应用推荐，满满的干货！
吐血整理,Ubuntu必备应用推荐,满满的干货! 哈喽,大家好,欢迎收看欢哥TV 我是欢哥.无论你是刚接触Ubuntu,还是最近从Windows改用Ubuntu,都会发现--我不知道该装哪些软件? 这 ...
vue-默认插槽-具名插槽-作用域插槽-ref，props，mixin混入，插件
插槽用法,ref,props,mixin混入,插件 ref props mini混入插件插槽默认插槽具名插槽作用域插槽 ref ref属性 1.被用来给元素或子组件注册引用信息(id的替代者 ...
目前最挣钱的自媒体平台是哪几个？千万别错过了！满满的干货
这两年,可以说是自媒体时代的高峰,各种大学生,全职太太都不再从事微商了,全部进军自媒体,为什么呢? 一定是因为有钱赚啊,不用花钱投资,在网上整理几张图片,随便写两三百个字,然后起个响亮的标题党,每分 ...
CR渲染器全景图如何渲染颜色通道_【扮家家云渲染】3Dmax干货技巧｜设置高质量室内模型渲染参数...
云渲染已更新至最新版本,渲染更极致! ☑ 全面支持 VR2.0 - VR5.0 版本: ☑ 已支持 CR动画渲染: ☑ 已支持multitexture.FloorGenerator插件2010-202 ...
【props单个数据绑定和多个数据绑定+vue默认插槽的基本使用+具名插槽的写法（2种）+插槽作用域3】
单个数据可以不用冒号,多个数据的传输需要用冒号,例如: <template><div class="layat"><Category :listDat ...
编程队伍队名_编程代码？程序设计？这里有满满的干货
编程代码让人头大程序设计使人掉发竞赛大佬到底怎么搞定难题的? 快来跟着团团一起寻找奥秘吧 11月28日晚7:00,郑州大学青年学术创新沙龙第十一讲于物理馆309教室开讲啦!本次沙龙邀请到郑州大学信 ...
想学编程但没有好的资料？来这吧！ Pygame 万字教程最全知识点总结不要客气全部拿走哈满满的干货
写了五万多字,花了我一个月的时间,小白其实可以直接把这个当书学,而且我这个比书好哈不喜勿喷!!! 因为我这个是我直接的详细总结,全部都是直接敲的,全部是干货,可以直接拿来学习哈文章篇幅很长,一时半 ...

插槽作用域渲染按钮开关 ~ 满满的干货哦

文章目录

渲染开关的状态

通过element-ui实现按钮的样式

渲染按钮的步骤

插槽作用域渲染按钮开关 ~ 满满的干货哦相关推荐

最新文章

热门文章