Recently, I used antd pro to write a project, and there was a drop-down box echo problem. The original code was quite simple, but the echo did not match.
The value I gave is id, and I want it to display name, but it does display id. .
The normal solution is as follows:
The original code code is as follows:
<ProFormSelect
name="parentId"
label="所属分类"
initialValue={formType === FormType.add ? '' : currentRow?.parentId}
valueEnum={classList}
rules={[{ required: true, message: '分类组名为必填项' }]}
/>The modified code is as follows:
<ProFormSelect
name="parentId"
label="所属分类"
initialValue={formType === FormType.add ? '' : currentRow?.parentId + ""}
valueEnum={classList}
rules={[{ required: true, message: '分类组名为必填项' }]}
/>Reason: In fact, the select component will automatically convert the corresponding id to a value display.
That is, the value type of id is not correct, parendId is number type, but the value in the component is string type, so put an empty string after parentdId, and it will be fine!
-------------------------- Here is an abnormal solution ----------------- -----------------
I echo the name directly. At this time, your echo can be correct. Switch the drop-down box to select and click to confirm again. There is no problem.
However, if you do not operate on the edit echo page and click OK directly, there will be problems.
The passed value parentId will become name,
Because I know that id must be a string of numbers, and name will basically not be a string of pure numbers. So I made the following judgment, (of course it is a bad way, but it is also a temporary solution to the problem)
if (isNaN(Number(value.parentId, 10))) {
}else{
}
Determine whether the value is a pure number, and then divide it into two cases, which can be handled separately.
There are tens of thousands of ways to solve a problem. If it doesn't work, we will change it.