Browse Source

Adopt bvaughn's example

main
Toru Kobayashi 7 years ago
parent
commit
2e1554dc32
  1. 18
      examples/16-3-release-blog-post/forward-ref-example.js

18
examples/16-3-release-blog-post/forward-ref-example.js

@ -20,9 +20,21 @@ function withTheme(Component) {
// We can pass it along to ThemedComponent as a regular prop, e.g. "forwardedRef"
// And it can then be attached to the Component.
// highlight-range{1-3}
return React.forwardRef((props, ref) => (
<ThemedComponent {...props} forwardedRef={ref} />
));
function refForwarder(props, ref) {
return (
<ThemedComponent {...props} forwardedRef={ref} />
);
}
// These next lines are not necessary,
// But they do give the component a better display name in DevTools,
// e.g. "ForwardRef(withTheme(MyComponent))"
// highlight-range{1-2}
const name = Component.displayName || Component.name;
refForwarder.displayName = `withTheme(${name})`;
// highlight-next-line
return React.forwardRef(refForwarder);
}
// highlight-next-line

Loading…
Cancel
Save