我试图将一个组件的引用传递给另一个组件。由于不推荐使用字符串引用，因此我使用了回调引用。

所以我有类似的东西：

<One ref={c => this.one = c}/>
<Two one={this.one}/>

问题是，每当我尝试访问this.props.one内部时，Two我都会得到undefined。

我什至尝试过Two：

componentDidMount(){
    setTimeout(()=>{
        console.log(this.props.one);
    },5000)
}

似乎问题在于，当创建prop时，ref并不存在，因为它是在One安装后创建的。但是我不知道如何“刷新”道具Two以获取对已安装组件的参考。

那么将ref传递到另一个组件的正确方法是什么？

编辑

一些用户建议将该逻辑封装在一个更高的组件中，该组件本身将呈现那些其他子组件。

这种方法的问题在于，您不能创建可重用的逻辑，而必须在那些封装组件中一遍又一遍地重复相同的逻辑。

假设您要创建一个通用<Form>组件，该组件封装了向商店提交逻辑，错误检查等。您可以执行以下操作：

<Form>
    <Input/>
    <Input/>
    <Input/>
    <Input/>
    <SubmitButton/> 
</Form>

在此示例<Form>中，由于this.props.children不返回这些实例，因此无法访问其实例（和方法）。它返回一些伪组件列表。

那么，如何在<Input/>不通过引用的情况下检查某人是否检测到验证错误呢？

您必须使用验证逻辑将这些组件封装在另一个组件中。例如在中<UserForm>。但是由于每种形式都不同，因此必须在<CategoryForm>，<GoupForm>等中复制相同的逻辑。这效率极低，这就是为什么我要封装验证逻辑<Form>并将<Input>组件的引用传递给的原因<Form>。