Warning: Input is changing an uncontrolled input of type text to be controlled...
2018-03-06 00:00
501 查看
摘要: Warning: `value` prop on `input` should not be null
Warning: Input is changing an uncontrolled input of type text to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components[/code]warning.js?6327:33 Warning: `value` prop on `input` should not be null. Consider using the empty string to clear the component or `undefined` for uncontrolled components. in input (created by Input) in Input (created by AdvertisementEdit) in div (created by FormGroup) in FormGroup (created by AdvertisementEdit) in div (created by Col) in Col (created by AdvertisementEdit) in div (created by Row) in Row (created by AdvertisementEdit) in div (created by CardBlock) in CardBlock (created by AdvertisementEdit) in div (created by Card) in Card (created by AdvertisementEdit) in AdvertisementEdit (created by Connect(AdvertisementEdit)) in Connect(AdvertisementEdit) (created by Route) in Route (created by Full) in Switch (created by Full) in div (created by Container) in Container (created by Full) in main (created by Full) in div (created by Full) in div (created by Full) in Full (created by Route) in Route in Switch in Router (created by ConnectedRouter) in ConnectedRouter in Provider
React开发中,每当出现类似这种的警告,对于强迫症来说真的很奔溃。
代碼如下<Select mode="multiple" size="large" style={{ width: '100%' }} placeholder="Please select" defaultValue={this.state.show} onChange={this.handleChangeOption} > {children} </Select>
原因解析:
Select 组件需要给它设置默认值,而这个值是由接口给它的,如果是前端自己定义值的话是没有什么问题的,由于react通过接口返回数据是有一定的周期。
第一次进入渲染该组件时,就已经让defaultValue生效了,之后再重新渲染的话不会改变其默认值。
defaultValue就是默认值,第一次设置时生效;value就是当前Select的值,设置value={this.state.value}就等于Select的当前值就是this.state.value。
参考资料: react 表单组件 用 defaultValue 还是 value
解决办法:
将 defaultValue 改为 value。<Select mode="multiple" size="large" style={{ width: '100%' }} placeholder="Please select" value={this.state.show} onChange={this.handleChangeOption} > {children} </Select>
相关文章推荐
- changing an uncontrolled input of type text to be controlled
- 类似Build Error: #513: a value of type "int" cannot be assigned to an entity of type "char *"
- The "." operator was supplied with an index value of type "java.lang.String" to be applied to a List
- How to solve the problem "A project with an Output Type of Class Library cannot be started directly "
- Bean named '...' is expected to be of type [...] but was actually of type [com.sun.proxy.$Proxy7解决方法
- comparison is always true due to limited range of data type 编译warning
- mm_The type of the expression must be an array type but it resolved to List
- “This text field does not specify an inputType ora hint” warning
- Hint: This may be the result of an unspecified view, due to default view name generation.)]
- caffe: fuck compile error again : error: a value of type "const float *" cannot be used to initialize an entity of type "float *"
- WARNING: Limit of open file descriptors is found to be 1024.
- JAVA: 解决is expected to be of type but was actually of type com.sun.proxy.$Proxy的问题
- Pymongo: TypeError: if no direction is specified, key_or_list must be an instance of list
- is expected to be of type 'org.com.ssh.hibernate.AOPService.EchoTest' but was actually of type 'com.
- The type of the expression must be an array type but it resolved to Point
- hbase-default.xml file seems to be for an older version of HBase ,this version is 1.2.0
- keil(MDK)中出现error: #513: a value of type "int" cannot be assigned to an entity of type "char *",即函数返回值无法赋值给对应变量的错误
- a value of type "const struct Menu * "cannot be assigned to an entity of type "struct Menu"
- Android开发报错:GoogleApiClient.isConnected()' was expected to be of type interface but instead was ...
- Err:The "." operator was supplied with an index value of type "java.lang.String" to be applied to a List or array