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数组,如果该 ...
随机推荐
- 深入理解jQuery插件开发总结(一)
由于这篇文章比较长,所以分了四个阶段讲,从简单的入门级到最后到综合级,有些列子和图片都是转载其他博主的,希望对想写插件对同学会有帮助.这里分享个好久之前写的一个jquery插件(网站的功能引导插件,思 ...
- JVM jmap
需求:经常会因为OOM而导致系统挂掉,很多服务无法连接,所以准备了解一下. 参考:http://www.open-open.com/lib/view/open1390916852007.html 一. ...
- webapi datetime类型序列化成json带T且时间不对问题的解决
在global.asax.cs里加入如下代码: protected void Application_Start() { GlobalConfiguration.Configuration.Forma ...
- 申请微信小程序步骤
一.注册 注册网址:https://mp.weixin.qq.com/ 选择账号类型:选择 小程序 注册账号 填写邮箱密码并激活:未注册过公众平台.开放平台.企业号.未绑定个人号的邮箱. 填写主体信息 ...
- JSTL数据格式化
日期表示 <fmt:formatDate value="${DATE1}" pattern="yyyy-MM-dd hh:mm:ss" type=&quo ...
- svg拖拽和缩放
需求:做机房平面图,用svg实现拖拽和缩放,刚开始一头雾水,不知所措,好在皇天不负有心人........ 本文重点介绍拖拽,单纯实现很简单,但是由于vue项目,机房图有很多事件,拖拽就成了难点 简单介 ...
- awk日志分析
前言 今天我们来讲讲如何用awk进行网站日志分析,得到页面平均耗时排行 文件 [xingxing.dxx@30_28_6_20 ~]$ cat logs /Oct/::: +] GET /pages/ ...
- 属性只有一个值的这类 html 属性是怎么回事,该如何设置值;比如:checked = “checked” vs checked = true
参考链接:https://stackoverflow.com/questions/10650233/checked-checked-vs-checked-true 问: What is the dif ...
- metasploit 连接database相关问题
我们首先去这个目录下看database.yml文件内容: 下图是我们看到的的信息 接着打开metasploit,运行db_connect 指令链接数据库.格式为: db_connect 用户名:密码@ ...
- create-react-native-app
create-react-native-app官网介绍链接,github文档,可以看看了解一下,总之是一个5分钟快速搭建react native项目并能看到效果的方法. 假设你已经安装了Node,你可 ...