Antd 组件Switch用法及代码记录

前言

switch开关按钮 android也有这个组件
最近开发web用到此组件，用法有些不同在此记录一下

实现效果

静态数据

在vue中< template> 标签直接三木表达式即可完成上述效果

 <template v-else-if="column.key === 'videoNum' && record.state == 1"><div class="status"><span>{{ record.videoNum }}</span><!-- 状态：0关1开 --><a-switch checked-children="启用" un-checked-children="停用" @change="handleVideoCheckd(record)":checked="record.stateVideo == 1 ? true : false" /></div></template>

:checked="record.stateVideo == 1 ? true : false
主要就是上述这句三木表达式根据值来返回 true 或 false
来完成想要的效果

Antd 组件Switch用法及代码记录相关推荐

react native 组件之switch组件的用法
写项目需要用到RN的switch组件,在官方文档上大概看了下,主要讲的就是switch组件的一些样式,还有调用的方法:onValueChiange,但关于怎么切换开关,怎么调用等,都没有提到..无奈 ...
java的switch_Java中Switch用法代码示例
一.java当中的switch与C#相比有以下区别注:在java中switch后的表达式的类型只能为以下几种:byte.short.char.int(在Java1.6中是这样), 在java1.7 ...
java中switch用法举例范围_Java中Switch用法代码示例
一.java当中的switch与C#相比有以下区别注:在java中switch后的表达式的类型只能为以下几种:byte.short.char.int(在Java1.6中是这样), 在java1.7后 ...
前端学习-Antd 组件库基础
一.概述 Antd 组件较多,这里介绍一些常用的组件,更详细的说明可以参考官方文档:组件总览 - Ant Design,本文章为此基础上进行整理. 1.安装 yarn add antd 或者 npm ...
Antd组件中单选框、复选框自定义样式的优雅实现
表单组件的样式控制算是antd组件使用的一大坑了. .以antd-mobile为例,checkbox选中与非选中状态是由Input包裹的父元素的'.am-checkbox-checked'来控制的未 ...
SVN switch 用法详解 (ZZ)
SVN switch 用法详解 (ZZ) http://www.cnblogs.com/dabaopku/archive/2011/05/21/2052820.html 确实,以前不会用switch ...
引入antd组件样式_扩大团队技术影响力，搭建团队自己的 UI 组件库
一.技术栈我们先简单了解一下要搭建一个团队的 UI 组件库,会涉及到哪些技术栈: Create React App:官方支持的 CLI 脚手架,提供一个零配置的现代构建设置: React: 用于构建 ...
python中os.path.join()的循环用法_Python os.path.join()用法及代码示例
Python中的OS模块提供了与操作系统进行交互的功能.操作系统属于Python的标准实用程序模块.该模块提供了使用依赖于操作系统的功能的便携式方法. os.path模块是Python中OS模块的su ...
vue3 内置组件keep-alive用法的全面介绍
vue3 内置组件keep-alive用法的全面介绍基础用法首先看一个反面例子 const app = Vue.createApp({template: `<button v-for=&qu ...

Antd 组件Switch用法及代码记录

前言

实现效果

静态数据

Antd 组件Switch用法及代码记录相关推荐

最新文章

热门文章