Reactjs 如何将子组件中定义的属性值传递给其父组件

我知道这个问题已经在堆栈溢出中得到了解决，但对我来说，我有更具体的要求。我想在子comp中定义道具的值，并能够将其值传递给其祖父母comp。 要定义值的子组件：

const Child = React.createClass(

   onselect(status) {
    let testProp = {refs: this.refs.statetext, status:status}
  }
    render() {
         return (
                <Mycomp ref="statetext"/>
        );
});

const Child=React.createClass(
onselect（状态）{
让testProp={refs:this.refs.statetext，status:status}
}
render（）{
返回(
);
});

母公司：

const Parent = React.createClass(
//can I access the refs.statetext here???
        render() {
             return (
                    <Child/>
            );
    });

const GrandParent = React.createClass(
    //here I'd like to access the testProp defined in the Child comp
           closeMenu() {
              //should have the testProp value here to do some action in this function.
           }
            render() {
                 return (
                        <Parent onScroll={this.closeMenu.bind(this)}/>
                );
        });

const Parent=React.createClass(
//我可以在这里访问refs.statetext吗？？？
render（）{
返回(
);
});

祖父母薪酬：

const Parent = React.createClass(
//can I access the refs.statetext here???
        render() {
             return (
                    <Child/>
            );
    });

const GrandParent = React.createClass(
    //here I'd like to access the testProp defined in the Child comp
           closeMenu() {
              //should have the testProp value here to do some action in this function.
           }
            render() {
                 return (
                        <Parent onScroll={this.closeMenu.bind(this)}/>
                );
        });

const祖父母=React.createClass(
//在这里，我想访问在子组件中定义的testProp
关闭菜单（）{
//这里应该有testProp值，以便在此函数中执行某些操作。
}
render（）{
返回(
);
});

---

这可能吗

声明/初始化

grander

组件中的变量，并通过props将其传递给

子组件。

这就是表示/容器组件的要点。如果您的
Child
组件依赖于
grander
组件，则您的状态应该位于该组件。
在
grander
组件中声明/初始化变量，并通过道具将其传递给
Child
。

这就是表示/容器组件的要点。如果您的
子组件
依赖于
祖父
组件，那么您的州应该在那里生存。
您似乎只需要一个事件，该事件将流向
祖父
组件。在React中，
道具向下流动，而
事件向上流动。因此，下面的代码通过
Parent
，将
onSelect
事件冒泡到
祖父
：

const Child = React.createClass(

   onselect(status) {
    let testProp = {refs: this.refs.statetext, status:status}
    this.props.onSelect(testProp);
  }
    render() {
         return (
                <Mycomp ref="statetext"/>
        );
});

const Child=React.createClass(
onselect（状态）{
让testProp={refs:this.refs.statetext，status:status}
this.props.onSelect（testProp）；
}
render（）{
返回(
);
});

然后：

const Parent=React.createClass(
//在这里，我想访问在子组件中定义的testProp
render（）{
返回(
);
});

然后：

const祖父母=React.createClass(
//在这里，我想访问在子组件中定义的testProp
关闭菜单（）{
//这里应该有testProp值，以便在此函数中执行某些操作。
}
onSelect（testProp）{
//这是：）
//现在，您可以将其保存为状态，以便在关闭菜单时可用。
log（testProp）；
}
render（）{
返回(
);
});
您似乎只需要一个事件，它将流向
组件。在React中，
道具向下流动，而
事件向上流动。因此，下面的代码通过
Parent
，将
onSelect
事件冒泡到
祖父
：

const Child = React.createClass(

   onselect(status) {
    let testProp = {refs: this.refs.statetext, status:status}
    this.props.onSelect(testProp);
  }
    render() {
         return (
                <Mycomp ref="statetext"/>
        );
});

const Child=React.createClass(
onselect（状态）{
让testProp={refs:this.refs.statetext，status:status}
this.props.onSelect（testProp）；
}
render（）{
返回(
);
});

然后：

const Parent=React.createClass(
//在这里，我想访问在子组件中定义的testProp
render（）{
返回(
);
});

然后：

const祖父母=React.createClass(
//在这里，我想访问在子组件中定义的testProp
关闭菜单（）{
//这里应该有testProp值，以便在此函数中执行某些操作。
}
onSelect（testProp）{
//这是：）
//现在，您可以将其保存为状态，以便在关闭菜单时可用。
log（testProp）；
}
render（）{
返回(
);
});
它不能回答您的问题，但ref通常是一种糟糕的react实践，您只是不在react中思考。为什么不在你的祖父母那里开始呢？或者找一个店长？@Nevosis使用
ref
在某些情况下是可以的，与“反应中思考”没有任何关系。例如，如果你想要一个不受控制的输入，你必须使用一个
ref
。它不能回答你的问题，但ref通常是一个糟糕的react实践，你只是不在react中思考。为什么不在你的祖父母那里开始呢？或者找一个店长？@Nevosis使用
ref
在某些情况下是可以的，与“反应中思考”没有任何关系。例如，如果你想要一个不受控制的输入，你必须使用一个
ref
。我认为问题在于如何使数据反向流动。顺便说一句，我不是落选者。但这是问题的正确答案。React是单向的，您不能通过组件向上传递道具。你可以使用ref作为一种解决方法，但这不是react方法。好的，那么在这种情况下，我可以访问祖父母内部我的孩子Comp中定义的ref吗？请查看@davintroon的答案，因为我相信它更适合你所寻找的。我想问题是如何将数据反向流动。顺便说一句，我不是落选者。但这是问题的正确答案。React是单向的，您不能通过组件向上传递道具。您可以使用refs作为一种方法来解决这个问题，但这不是react方法。好的，在这种情况下，我可以访问吗