• Antd pro中ProFormSelect使用initialValues


    最近使用antd pro写项目,其中有一个下拉框回显问题,原本挺简单的代码,但是就是回显对不上。

    我给的值是id,想让其显示name,但是显示的确实id。。

    正常的解决思路如下:

    原代码代码如下:

    1. <ProFormSelect
    2. name="parentId"
    3. label="所属分类"
    4. initialValue={formType === FormType.add ? '' : currentRow?.parentId}
    5. valueEnum={classList}
    6. rules={[{ required: true, message: '分类组名为必填项' }]}
    7. />

    修改后代码如下:

    1. <ProFormSelect
    2. name="parentId"
    3. label="所属分类"
    4. initialValue={formType === FormType.add ? '' : currentRow?.parentId + ""}
    5. valueEnum={classList}
    6. rules={[{ required: true, message: '分类组名为必填项' }]}
    7. />

    原因:实际上 select 组件会自动将对应的 id 转为值展示。

    就是id的值类型没有对上,parendId是number类型,但是在组件里的值是string类型的,所以在parentdId后面拼个空字符串,就好了!

    -------------------------下面来个不正常的解决思路----------------------------------

    我回显直接给name,这个时候你回显倒是能对上,切换下拉框选择再次点击确认,也没问题。

    但是如果在编辑回显页面,不操作,直接点击确认,就会有问题。

    传的值parentId就会变为name,

    由于我知道id肯定是一串数字,而name基本上不会是一串纯数字。所以做了如下的判断,(当然是个不好的办法,但是也是一种临时解决问题的思路)

    if (isNaN(Number(value.parentId, 10))) {

    }else{

    }

    判断下值是不是纯数字,然后分为两种情况,分别处理也行。

    一个问题的解决方法千万种,不行咱就换。

  • 相关阅读:
    重温Servlet
    C语言宏的几种常用语法与示例
    使用pandas处理excel文件【Demo】
    一图说清在哪里查看阿里云已购资源包
    单组率的meta分析——R与Stata
    读后感读后感读后感
    OSI与TCP IP各层的结构与功能,都有哪些协议
    【React】生命周期
    热烈推荐的 几个关于React的 工具
    代码随想录算法训练营第六十天 | LeetCode 84. 柱状图中最大的矩形
  • 原文地址:https://blog.csdn.net/chhpearl/article/details/126134181