- 场景是和服务端进行通讯,true是1,false是2,页面需要使用Switch组件,如何优雅的写这个formatter
组件是arco,arco的form表单可以用normalize和formatter配合,定义一个枚举
enum ProtectionSwitchEnum {
true = 1,
false,
}
// 表单项
normalize: val => ProtectionSwitchEnum[val],
formatter: val => JSON.parse(ProtectionSwitchEnum[val]),
2.一开始的时候ProtectionSwitchEnum定义成常量枚举了,TS疯狂报错A const enum member can only be accessed using a string literal.,明明合规使用为什么老说only be accessed using a string literal,百度以后发现定义出了问题
link一个笔记
总结:
enum实际是通过在立即执行函数内进行两次双向的赋值实现的
const enum编译后并没有相关代码
const enum没有相关代码 所以相对节省内存 只是起到一个语法提示的作用
3.表单中对switchsetValue不生效
4.以上都设置了,可以读取参数回显了,但是无法change
一开始以为是组件内部没有做好,因为这个组件是在内部做了一个转发,是个老组件,最开始的是antd,后来组件迁移到arco这个使用的地方很多,所以自己在内部重写了一下,把接收到的antd-props都转成arco了,还以为是内部有什么问题,确实是个历史遗留,并且之前都没有使用switch作为表单项.翻了好久,甚至优化了转发的代码
最后发现!
居然是formatter的时候把字符串true转成布尔值true,我居然用的是boolean()
???
boolean是===!!,把参数转成布尔值,但是不是把字符串true转成布尔值true啊!!
(会不会还有人没有反应过来发生了什么,可以在控制台打一下boolean('false'),假笑)
最后改成JSON.parse()提测
可真是,很小很小的常识问题,不知道怎么就犯了一整天,改了一天,总算fix了. [yy扶额苦笑.jpg]