react-redux-typescript-guide icon indicating copy to clipboard operation
react-redux-typescript-guide copied to clipboard

Document createRef and forwardRef usage

Open adrienharnay opened this issue 6 years ago • 2 comments

Fixes #72

adrienharnay avatar Dec 11 '18 09:12 adrienharnay

Hey @adrienharnay. Thanks for your contribution. Could you please check the contributing.md guide.

One note, this PR doesn't fix #72 entirely, it would be great to include some React component example. Examples from react docs are preferred: https://reactjs.org/docs/forwarding-refs.html

const FancyButton = React.forwardRef((props, ref) => (
  <button ref={ref} className="FancyButton">
    {props.children}
  </button>
));

// You can now get a ref directly to the DOM button:
const ref = React.createRef();
<FancyButton ref={ref}>Click me!</FancyButton>;

The best place to put it would be in the stateless components section:

piotrwitek avatar Dec 11 '18 22:12 piotrwitek

That is not super clear how to use forwardRef with 16.8 react. I am using const Component = (props: IProps, ref?: React.Ref<HTMLDivElement>) => {...} .

artyomtrityak avatar Mar 23 '19 19:03 artyomtrityak