ant design vue 在列表中使用插槽 例如当性别为0的时候在列表中我想显示男

简介: ant design vue 在列表中使用插槽 例如当性别为0的时候在列表中我想显示男

使用方式

找到需要添加插槽的列,例如我想给性别这一列添加插槽,当text=0的时候显示男,当text=1的时候显示女,否则就显示未知

这是原代码

{
  title: '性别',
  align: 'center',
  dataIndex: 'sex',
},

·把下面的这段代码添加进去

customRender: function (text) {
  return text == 0 ? '男' : text == 1 ? '女' : '未知'
  },

完整的代码如下

{
  title: '性别',
  align: 'center',
  dataIndex: 'sex',
},
customRender: function (text) {
  return text == 0 ? '男' : text == 1 ? '女' : '未知'
  },

这是基本的使用方式,后期会分享一些复杂的实现方式!

目录
相关文章
|
2天前
|
JavaScript Java 测试技术
基于vue和微信小程序的校园自助打印系统+springboot+vue.js附带文章和源代码设计说明文档ppt
基于vue和微信小程序的校园自助打印系统+springboot+vue.js附带文章和源代码设计说明文档ppt
20 7
|
2天前
|
JSON JavaScript 前端开发
|
2天前
|
JavaScript 前端开发 Java
开发语言漫谈-Vue
Vue严格说来不是一门语言
|
3天前
|
JavaScript 前端开发 C++
【Vue】Vue快速入门、Vue常用指令、Vue的生命周期
【Vue】Vue快速入门、Vue常用指令、Vue的生命周期
13 2
|
13天前
|
缓存 监控 JavaScript
探讨优化Vue应用性能和加载速度的策略
【5月更文挑战第17天】本文探讨了优化Vue应用性能和加载速度的策略:1) 精简代码和组件拆分以减少冗余;2) 使用计算属性和侦听器、懒加载、预加载和预获取优化路由;3) 数据懒加载和防抖节流处理高频事件;4) 图片压缩和选择合适格式,使用CDN加速资源加载;5) 利用浏览器缓存和组件缓存提高效率;6) 使用Vue Devtools和性能分析工具监控及调试。通过这些方法,可提升用户在复杂应用中的体验。
34 0
|
14天前
|
JavaScript 前端开发
vue(1),小白看完都会了
vue(1),小白看完都会了
|
5天前
|
存储 缓存 JavaScript
谈谈你对vue的了解
谈谈你对vue的了解
16 3
|
6天前
|
JavaScript API
Vue axjx 跨域请求
Vue应用中解决跨域问题可通过配置代理服务器。方法一是设置`devServer.proxy`到目标服务器端口,如`http://localhost:3000`,然后使用axios发送请求。方法二是为多个代理配置,如`/api`和`/api2`,分别指向不同端口,利用`pathRewrite`重写路径。请求时需加上相应前缀,如`/api/index`。
17 1
|
6天前
|
JavaScript 前端开发 Java
JavaSE精选-Vue
JavaSE精选-Vue
7 1
|
6天前
|
JavaScript
Vue父子组件传值
<!-- 父组件向子组件传地值 -->
18 2