iview中table里嵌套i-switch、input、select等
iview中table内嵌套


input
render:(h,params) => {
return h('Input',{
props: {
value:'',
size:'small',
},
on: {
input: (val) => {
t.data[params.index].estimateTime = val
}
},
})
}
select
render: (h, params) => {
return h('Select',{
props:{
},
on: {
'on-change':(event) => {
this.data[params.index].volumeType = event;
}
},
},
params.row.action.map((item) =>{
return h('Option', {
props: {
value: item.value,
label: item.name
}
})
})
)
}
i-switch
render: (h, params) => {
//return h('元素',{元素的性质},'内容')
return h('i-switch', {
props: {
size: "large",
value: params.row.status == "true"
},
on: {
'on-change': (value) => {
params.row.status = value;
const th = this;
axios.get(th.url + '/departmentType/updateStatus', {
params: {
dId: params.row.dId,
status: value
}
}).then(function(res) {
if (res.data.code === 1028) {
th.$Message.success(res.data.message);
} else {
th.$Message.error(res.data.message);
th.changePage(1);
}
})
}
}
},
[h('span', {
slot: "open",
domProps: {
innerHTML: '正常'
}
}),
h('span', {
slot: "close",
domProps: {
innerHTML: '冻结'
}
}),
]
)
}
InputNumber
render: (h, params) => {
return h('div', [
h('InputNumber', {
props: {
size: "large",
value: params.row.dSort
},
on: {
'on-change': (value) => {
this.DepartmentType.dId =params.row.dId;
this.DepartmentType.dSort = value;
this.updateSort();
}
}
})
])
}
iview中table里嵌套i-switch、input、select等的更多相关文章
- iview 中table列 一列显示多个数据(后台返回数组显示在列内)
一.首先出现的是比较复杂的一种情况(多个key) 1.首先页面显示效果如下 2.后台返回数据格式如下: 3.在iview中table的columns中的render函数: 4.具体代码 render: ...
- jquery中table里面的tr里的input添加一行,并且第一列autoincrement
实现添加一行并且第一列由A0开始autoincrement,代码如下(在文件的同一个文件夹下添加一个jquery.js文件): <!DOCTYPE html PUBLIC "-//W3 ...
- iview中table的render()函数
Vue 推荐在绝大多数情况下使用 template 来创建你的 HTML.然而在一些场景中,你真的需要 JavaScript 的完全编程的能力,这就是 render 函数,它比 template 更接 ...
- iview中table多选、加载更多、下载等使用
记录工作中的点点滴滴,为回忆过往添加片片记忆... 一.Table 1.使用render函数多层渲染以及表格可展开使用 源码地址:https://gitee.com/Mandy_wang/iview- ...
- iview之——table中嵌套input、select等
使用iview在table中嵌入button是比较常见的需求,但是在table中嵌入input或者select你是否考虑过呢?本文用实例介绍input和select在table中的嵌套. 理解tabl ...
- vue+iview中的table表格导出excel表格
一.iveiw框架中table中有exportCsv()方法可以导出.csv后缀文件,类似于excel文件,但是并不是excel文件. 二.实现table表格导出excel文件利用Blob.js 和 ...
- VS2010 MFC中制作Visual Studio风格的停靠侧栏窗口(CDockablePane里嵌套FormView表单视图)
VS2010 MFC中制作Visual Studio风格的停靠侧栏窗口(CDockablePane里嵌套FormView表单视图) 1. 在资源窗口里新建一个FormView的Dialog,修改ID为 ...
- [RN] React Native中使用 react-native-scrollable-tab-view嵌套在ScrollView里,导致 子内容 在安卓上无法显示
React Native中使用 react-native-scrollable-tab-view嵌套在ScrollView里,导致 子内容 在安卓上无法显示 问题: 0.9.0 或 0.8.0 版本的 ...
- iview的table组件中加入超链接组件,可编辑组件,选择组件,日期组件
这篇文章主要介绍了iview的table组件中使用选择框,日期,可编辑表格,超链接等组件. 1.select选择组件 // tableColumn数组响应对象需要传入一个固定的option数组,如果该 ...
随机推荐
- CF Dima and Salad 01背包
C. Dima and Salad time limit per test 1 second memory limit per test 256 megabytes input standard in ...
- Nginx 503错误总结
nginx 503错误(Service Temporarily Unavailable 服务暂时不可用): 503是一种HTTP状态码,由于临时的服务器维护或者过载,服务器当前无法处理请求.这个状况 ...
- 部署基于python语言的WEB发布环境
一.部署说明 1.python语言介绍 python简介 2.实验环境 实验机器:Vmware虚拟机 8核10G 网卡:桥接模式 系统:centos7.5 防火墙:关闭 Selinux:关闭 网段:1 ...
- Hadoop序列化程序报错
这个错误指向序列化类,注意实现的Read和Wirte顺序一定要一致,并且要使用基本类型,不要使用包装类. java.lang.Exception: java.io.EOFException at or ...
- Redis学习笔记(一) ---- Linux系统中部署Redis存储系统
Redis 一.Redis简介 1.Redis是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).set(集合 ...
- "UTF-8"、"UTF8"、"utf-8"、"utf8"之间的区别
本质上没有区别.1.“UTF-8”是标准写法;2.在Windows下边英文不区分大小写,所以也可以写成“utf-8”;3.“UTF-8”也可以把中间的“-”省略,写成“UTF8”.一般程序都能识别,但 ...
- 基于Docker搭建GitLab服务器
运行环境:CentOS 7.4 一.安装Docker Docker安装可以参照runoob教程(http://www.runoob.com/docker/centos-docker-install.h ...
- Redux学习笔记--异步Action和Middleware
异步Action 之前介绍的都是同步操作,Redux通过分发action处理state,所有的数据流都是同步的,如果需要一步的话怎么办? 最简单的方式就是使用同步的方式来异步,将原来同步时一个acti ...
- [翻译] 单例(Singleton)
英文原文: https://sourcemaking.com/design_patterns/singleton 意图 确保一个类只有一个实例,并提供一个访问其实例的全局点: 封装 “即时初始化” ( ...
- react-native-splash-screen
react-native-splash-screen在GitHub上的地址:https://github.com/crazycodeboy/react-native-splash-screen rea ...