使用高阶组件在不同的组件间共享跟踪逻辑
例如:给不同组件添加分析跟踪代码
import tracker from './tracker.js';
// HOC
const pageLoadTracking = (ComposedComponent) => class HOC extends Component {
componentDidMount() {
tracker.trackPageLoad(this.props.trackingData);
}
componentDidUpdate() {
tracker.trackPageLoad(this.props.trackingData);
}
render() {
return <ComposedComponent {...this.props} />
}
};
// Usage
import LoginComponent from "./login";
const LoginWithTracking = pageLoadTracking(LoginComponent);
class SampleComponent extends Component {
render() {
const trackingData = {/** Nested Object **/};
return <LoginWithTracking trackingData={trackingData}/>
}
}