question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Set labelInvalue in select component, placeholder dispaly incorrect!

See original GitHub issue
  • I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.1.4

Environment

mac 10.13.5 , chrome 67.0.3396.87 , react 16.2.0

Reproduction link

https://codepen.io/littlelane/pen/eKVyRM?editors=0010

Steps to reproduce


		const mipayFormOptios = [
			{
				label: '医保中心',
				type: 'select',
				placeholder: '请选择医保中心',
				field: 'accountNo',
				initialValue: handleType === 'update' ? {key: thisRecord.accountNo, label: thisRecord.medicalCenterName } : {key: ''},
				options: { options: medicalList, label: 'medicalCenterName', value: 'medicalCenterNo' },
				labelInValue: true,
				rules: [{
					required: true, message: '请选择医保中心',
				}]
			}, {
				label: '医疗机构编号',
				type: 'input',
				placeholder: '请输入医疗机构编号',
				field: 'medicalJournalNo',
				initialValue: thisRecord.medicalJournalNo,
				maxLength: 40,
				rules: [{
					required: true, message: '请输入医疗机构编号',
				}, {
					pattern: CODE_REG, message: '请输入长度最大为40位的包含数字、字母和下划线的编码'
				}]
			}
		]

What is expected?

expect when set labelInvalue in select component,the select accept type of value not only {key: string | number, label: ReactNode},but also {key: string | number | undefined, label: ReactNode} ! Because the select component only set undefined, the placeholder can display correct!

What is actually happening?

the select accept value type only {key: string | number, label: ReactNode}, when select component init the placeholder can’t display correct!

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:10 (3 by maintainers)

github_iconTop GitHub Comments

9reactions
lovemegowincommented, Jul 25, 2019

这个bug没修复就这么关了。。。。

5reactions
ryanjwesselcommented, Oct 26, 2018

Actually, I did get it to display the placeholder. Basically, my value prop went from this:

value={{key: filter.keyName, label: filter.labelName}}

to this:

value={filter ? { key: filter.keyName, label: filter.labelName } : undefined }

That will display the placeholder correctly, but this will definitely be confusing for other developers that look at this code in the future.

Read more comments on GitHub >

github_iconTop Results From Across the Web

antd design select placeholder issues - Stack Overflow
How can I solve this issue so that the placeholder appears if value is null? javascript · reactjs · redux · create-react-app ·...
Read more >
Select - Ant Design
Select component to select value from options. ... The labelInValue prop can be used to get the label property of the selected item....
Read more >
Select - Ant Design
Select component to select value from options. ... A dropdown menu for displaying choices - an elegant alternative to the native <select> element....
Read more >
Select - Ant Design
Select component to select value from options. When To Use#. A dropdown menu for displaying choices - an elegant alternative to the native...
Read more >
ProFormFields - ProComponents
We support pass-through of placeholder , so you can set placeholder directly on the component. Each form item also supports readonly , which...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found