Reactjs React无状态函数HOC get INTERNAR elment as ref
根据: 不能对功能组件使用ref属性,因为它们没有实例 但是,如果我的功能组件是一个HOC?,并且我希望获得内部组件的引用,它将不会是无状态的,那么会发生什么呢 我有以下组成部分:Reactjs React无状态函数HOC get INTERNAR elment as ref,reactjs,Reactjs,根据: 不能对功能组件使用ref属性,因为它们没有实例 但是,如果我的功能组件是一个HOC?,并且我希望获得内部组件的引用,它将不会是无状态的,那么会发生什么呢 我有以下组成部分: export default (WrappedComponent) => { let meta = {}; const WithForm = (props, context) => { const newMeta = { form: context.form }; if (!sha
export default (WrappedComponent) => {
let meta = {};
const WithForm = (props, context) => {
const newMeta = { form: context.form };
if (!shallowEqual(meta, newMeta)) {
meta = newMeta;
}
return (
<WrappedComponent
{...props}
meta={meta}
/>
);
};
WithForm.propTypes = {
meta: PropTypes.object
};
WithForm.contextTypes = {
form: PropTypes.object
};
return WithForm;
};
导出默认值(WrappedComponent)=>{
设meta={};
const with form=(道具、上下文)=>{
const newMeta={form:context.form};
如果(!shallewequal(meta,newMeta)){
meta=newMeta;
}
返回(
);
};
WithForm.propTypes={
meta:PropTypes.object
};
WithForm.contextTypes={
形式:PropTypes.object
};
以表格形式返回;
};
我希望绕过此无状态组件,将其交给其父级,执行以下操作:
<WrappedComponent
{...props}
meta={meta}
ref={this.ref} /* obviously wont work */
/>
i、 e:
组件B:WithForm(B);
A部分:
render(){
返回{this.b=instance}}/>
}
有没有办法达成类似的解决方案
注意:
- 请注意,我已经考虑过创建自己的函数,并使用this实例-->this.props.attachMyRef(this)调用它
- 我还考虑将这个无状态组件变成普通的react组件
ComponentB: WithForm(B);
Component A:
render() {
return <ComponentB ref={(instance) => { this.b = instance }} />
}