You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
25 lines
778 B
25 lines
778 B
function logProps(Component) {
|
|
class LogProps extends React.Component {
|
|
componentDidUpdate(prevProps) {
|
|
console.log('old props:', prevProps);
|
|
console.log('new props:', this.props);
|
|
}
|
|
|
|
render() {
|
|
// highlight-next-line
|
|
const {forwardedRef, ...rest} = this.props;
|
|
|
|
// Assign the custom prop "forwardedRef" as a ref
|
|
// highlight-next-line
|
|
return <Component ref={forwardedRef} {...rest} />;
|
|
}
|
|
}
|
|
|
|
// Note the second param "ref" provided by React.forwardRef.
|
|
// We can pass it along to LogProps 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) => {
|
|
return <LogProps {...props} forwardedRef={ref} />;
|
|
});
|
|
}
|
|
|