You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
If you worked with React before, you might be familiar with an older API where the ref attribute is a string, like "textInput", and the DOM node is accessed as this.refs.textInput. We advise against it because string refs have some issues, are considered legacy, and are likely to be removed in one of the future releases. If you’re currently using this.refs.textInput to access refs, we recommend the callback pattern instead.
classCustomTextInputextendsReact.Component{constructor(props){super(props);this.focusTextInput=this.focusTextInput.bind(this);}focusTextInput(){// Explicitly focus the text input using the raw DOM APIthis.textInput.focus();}render(){// Use the `ref` callback to store a reference to the text input DOM// element in an instance field (for example, this.textInput).return(<div><inputtype="text"ref={(input)=>{this.textInput=input;}}/><inputtype="button"value="Focus the text input"onClick={this.focusTextInput}/></div>);}}
The text was updated successfully, but these errors were encountered:
String refs are used at least in the example in README - https://github.com/igorprado/react-notification-system#using.
Taken from official React documentation - https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs
Legacy API: String Refs
If you worked with React before, you might be familiar with an older API where the
ref
attribute is a string, like"textInput"
, and the DOM node is accessed asthis.refs.textInput
. We advise against it because string refs have some issues, are considered legacy, and are likely to be removed in one of the future releases. If you’re currently usingthis.refs.textInput
to access refs, we recommend the callback pattern instead.The recommended way
https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element
The text was updated successfully, but these errors were encountered: