对iView使用过程中一些特殊的地方进行总结,后续遇到会持续更新...
Table导出csv嵌套对象
handleStr(str){
let handleStr=str.replace(/[\r\n]/g,"");
//先判断字符里是否含有逗号
if(str.indexOf(",") != -1){
//如果还有双引号,先将双引号转义,避免两边加了双引号后转义错误
if(str.indexOf("\"") != -1){
// 这里必须对全局进行替换,网上原版是没有的,不加全部只能处理数组,不能处理json
handleStr=str.replace(/\"/g, "\"\"");
}
//将逗号转义
handleStr="\""+handleStr+"\"";
return handleStr
}
return "\""+handleStr+"\"";
}
Table中添加图片
column:[
{
title: "头像",
width: 160,
render: (h, params) => {
return h('img', {
style: {
width: "100px",
},
// 可以使用domProps或者attrs
domProps: {
src: params.row.url
}
// attrs: {
// src: params.row.url
// }
})
}
}
]
Table中Input等元素操作修改data值
<Table :columns="column" :data="data"/>
column:[
{
title: "标签",
width: 160,
render: (h, params) => {
return h("Input", {
props: {
value: params.row.label
},
on: {
"on-blur": event => {
this.data[params.row.index].label = params.row.label =
event.target.value;
}
}
});
}
}
]
Form表单对数字、数组校验
{type: 'number', message: '请输入数字', trigger: 'blur'}
{type: 'array', message: '请选择', trigger: 'blur'}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。