我在使用ReactTags
警告:
Warning: Failed prop type: You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.
in input (created by Input)
in div (created by Input)
in Input (created by ReactTags)
in div (created by ReactTags)
in div (created by ReactTags)
根据这里所说的https://github.com/i-like-robots/react-tags/blob/master/lib/Input.js#L78 :
defaultValue={query}
你怎么认为?
谢谢!
我有同样的问题,有什么建议吗?
恐怕我自己没有见过这个,你能告诉我你使用的是哪个 React 版本吗?
我正在使用 React 16.3.2
@i-like-robots 我也遇到了这个问题。
我添加了一个 PR 来更改为 defaultValue,但是如果您想要一个在修复之前避免警告的 hack,您可以向使用 ReactTags 的类添加一个 noop 方法,并将其作为组件的 onChange 引用。 这很丑陋,但它会停止警告。
noOp() {
// does nothing
}
<ReactTags
tags={this.state.tags}
suggestions={this.state.suggestions}
handleAddition={this.handleTagAddition}
handleDelete={this.handleTagDelete}
inputAttributes={{ onChange: this.noOp }}
/>
这是一个有趣的问题,几年前在https://github.com/facebook/react/issues/1118 中详细讨论过(尽管我从未见过这个警告,任何版本的 React 包括 16.3.2! )
当前的实现在技术上没有_错误_,但我同意使控制台混乱的警告很烦人,应该避免。
我不确定设置defaultValue
是正确的解决方案,因为它可能会产生意想不到的后果(参见 https://github.com/i-like-robots/react-tags/pull/139#issuecomment-431006214 ) 但可能还有其他几种解决方法可用。
再研究一下,我可以看到这个警告有 5 个条件:
这是我感兴趣的第一个条件,因为默认情况下这个 _should_ 评估为true
因为state.query
的默认值是一个空字符串。 因此,这应该会导致函数提前返回并且不输出警告。
因此,要触发此警告,我必须更改默认状态 (https://github.com/i-like-robots/react-tags/blob/master/lib/ReactTags.js#L35) 以使其成为真实值。
有没有遇到过这个问题的例子,让我可以更仔细地研究一下?
最有用的评论
我添加了一个 PR 来更改为 defaultValue,但是如果您想要一个在修复之前避免警告的 hack,您可以向使用 ReactTags 的类添加一个 noop 方法,并将其作为组件的 onChange 引用。 这很丑陋,但它会停止警告。