iview tabs里面放入 i-switch slot的写法

简介: iview tabs里面放入 i-switch slot的写法
        {
          'title': '状态',
          'key': 'status',
          render: (h, params) => {
            return h(
              'i-switch',
              {
                props: {
                  trueValue: 1,
                  falseValue: 0,
                  beforeChange: () => {
                    // if (status === 0)
                    console.log(params.row.status)
                    if (params.row.status === 1) {
                      console.log('000')
                      return new Promise((resolve) => {
                        this.$Modal.confirm({
                          title: '确认停用',
                          content: '停用商品后,该商品将不允许继续被选择,但不影响当前售卖。如果希望取消商品售卖,请在售货机详情中进行操作。',
                          onOk: () => {
                            this.changeStatus(params.row.status, params.row.id)
                          }
                        })
                      })
                    } else {
                      console.log('111')
                      this.changeStatus(params.row.status, params.row.id)
                    }
                  },
                  value: Number(params.row.status),
                  size: 'large'
                }
              },
              [
                h('span', {
                  slot: 'open'
                }, '启用'),
                h('span', {
                  slot: 'close'
                }, '停用')
              ]
            )
          }
        },
    render:(h,params)=>{
        return h('i-switch',{
            props:{
                value:params.row.status
                size:'large'
            },
            scopedSlots:{
                open:()=>h('span','开启'),
                close:()=>h('span','停用')
            }
        })
    }

相关文章
|
JavaScript 数据格式
Ant Design Vue如何上传文件、图片,复制即用
Ant Design Vue如何上传文件、图片,复制即用
2442 0
Ant Design Vue如何上传文件、图片,复制即用
|
前端开发 iOS开发
通过css内修改input框placeholder样式
通过css内修改input框placeholder样式
543 1
|
4月前
|
存储 缓存 自然语言处理
从零搭建企业私有知识库:RAG + 大模型实战(附完整代码)
本文详解如何用RAG技术构建企业私有知识库:支持PDF/TXT/DOCX等文档上传、向量化存储与智能问答,让大模型精准理解业务数据,兼顾数据隐私、领域专业性与实时性,附完整代码与部署方案。
|
12月前
|
开发工具 git
解决 VSCode 安装通义灵码后左侧菜单栏不显示按钮的问题
在 VSCode 中安装通义灵码插件后,若左侧活动栏未显示图标,可通过右键选中代码触发插件面板,并将其图标拖至左侧栏固定,便于后续快速使用。
5265 116
axios中get/post请求方式
axios中get/post请求方式
410 0
axios中get/post请求方式
|
存储 缓存 文件存储
如何保证分布式文件系统的数据一致性
分布式文件系统需要向上层应用提供透明的客户端缓存,从而缓解网络延时现象,更好地支持客户端性能水平扩展,同时也降低对文件服务器的访问压力。当考虑客户端缓存的时候,由于在客户端上引入了多个本地数据副本(Replica),就相应地需要提供客户端对数据访问的全局数据一致性。
33254 202
如何保证分布式文件系统的数据一致性
|
设计模式 存储 监控
设计模式(C++版)
看懂UML类图和时序图30分钟学会UML类图设计原则单一职责原则定义:单一职责原则,所谓职责是指类变化的原因。如果一个类有多于一个的动机被改变,那么这个类就具有多于一个的职责。而单一职责原则就是指一个类或者模块应该有且只有一个改变的原因。bad case:IPhone类承担了协议管理(Dial、HangUp)、数据传送(Chat)。good case:里式替换原则定义:里氏代换原则(Liskov 
36823 22
设计模式(C++版)
|
存储 编译器 C语言
抽丝剥茧C语言(初阶 下)(下)
抽丝剥茧C语言(初阶 下)

热门文章

最新文章