Question

我有这样的组件树：

<App />
  <NoteList />
    <Note />
  <Notes />

我正在从NoteList组件中的Notes组件运行一个函数，除了传递参数外，其他所有东西都可以正常工作。

这是我的代码：

<NoteList displayChange={() => this.content.displayNote()} />
<Notes
   ref={instance => {
        this.content = instance;
       }}
/>

这是displayNote函数，通过NoteList组件中的displayChange调用

displayNote = test => {
  console.log("id", test)
  console.log("sibling linked!")
};

它通过NoteList组件中的一个函数运行：

callbackFunction = childData => {
    console.log("childData", childData);
    this.props.displayChange(childData);
  };

因此，当运行callbackFunction时，displayChange（）可以正常运行，但childData不能正确传递。我的意思是，当childData作为参数传递时，最终在console.log中未定义。

有什么解决办法吗？

Answer 1

我设法使其正常运行，下面是代码：

 callbackFunction = childData => {
    console.log("childData", childData);
    this.props.displayChange(childData);
  };

<NoteList displayChange={(id) => this.content.displayNote(id)} />
  <Notes
     ref={instance => {
       this.content = instance;
       }}
   />

ReactJS从同级到同级组件传递参数

1 个答案: