记录本周改bug遇到的问题,主要是组件层面样式、功能修改。
- elTree横向滚动条
一开始盯着elTree根dom改overflow,一点用没有,后来百度到了答案
.tree-wrapper {
w & h
overflow: auto;
.my-tree {
display: inline-block;
min-width: 100%;
}
}
原tree是block。
- lazyLoad的叶节点不显示三角
原以为是后端返回的children字段是[],但是改为null甚至删除后都没用;又试着改loadNode方法,在最后一级resolve(null)(原来是resolve([])),直接报错了——组件内部会遍历resolve的值,所以只能是数组。最后发现了盲点,一开始我设置了props,将isLeaf映射到后端返回的字段indexType上,但是indexType是0或者1,isLeaf要求的是boolean,我想着隐式转换一下应该也行就没太在意,结果真是这个问题。
props: {
isLeaf: data => {
return !data.indexType
}
}
- lazyTree的叶节点双击
需要绑定叶节点的双击事件,api没有,slot试了也不行,可能跟懒加载有关,待解决。 - antd upload 自定义上传
原来做上传都是action写上传接口,但是新公司的模式是上传时先不走接口,表单提交时再一起传,理论上更省服务器空间。但是没有action怎么办呢?上传会失败,失败就有fail样式,手动改颜色还行,但是有个tooltip改不了,所以还是得找别的方法。
自定义上传customRequest属性,不过文档没说的很清楚,百度了一个比较有用的https://blog.csdn.net/raingrains/article/details/114445830,这个还有进度条的模拟,我这边不需要。但是遇到问题,上传后一直loading,想了很久没懂,乱试试出来了——onSuccess执行需要异步。
customUpload(opt) {
queueMicrotask(() => {
opt.onSuccess('', opt.file)
})
}
还有几个不是el和antd的问题
- li模拟disabled
用li做的buttonGroup,但是disabled需要模拟,开始只改了样式,颜色、not-allowed这种,后来发现事件还是有效果,要用pointer-event: none;
来清除,且此属性会覆盖cursor: not-allowed;
。 - vxe-table虚拟列表formatter失效
因为数据量很大,所以用到了vxe-table,这里还踩了个坑,结论是vFor的key千万不能用遍历的索引!!!
有个动态格式化的需求,格式化是做出来了,但是只能格式化一部分,就是可视域之外的,能看到的表格行formatter是无效的。内网关系,没有截图。待解决。
网友评论