Javascript 在从父级作为prop传递的子级中调用方法时遇到问题

我发现了一堆问题，看起来像是重复的，但我似乎无法解决这个问题。我有一个父组件：

class Parent extends Component {
  constructor(props) {
  super(props);

this.state = {
  //some other props
  currentDate: moment()
};

componentDidMount() {
  this.fetchData();
}

fetchData() {
  this.setState({
    //set some state here
  });
  //Some Api call
}

onDateChange(currentDate) {
  this.setState({
    currentDate
  });
}
//doing some stuff to render a table
return (
  <div>
    <ChildComponent
      currentDate={this.state.currentDate}
      onDateChange={(date) => this.onDateChange(date)}
    />
    {currentView}
  </div>
);
}

render() {
 return (
  <div>
    //renders table
  </div>
);

我可以看到函数和它应该执行的代码。我尝试创建一个调用this.props.onDateChange的方法，然后调用该方法，但仍然不起作用。我不明白为什么我能够让方法作为道具传递，但我不能调用它。我意识到有很多问题在问如何将函数作为一个道具传递，我能够做到这一点，但我无法让这个函数执行。提前谢谢

---

编辑：我已经更新了代码以添加以下建议。我现在没有收到任何错误，但它仍然没有按预期工作。如果/当我找到它时，我将向您报告。

您忘记调用arrow函数中的函数：

        onDateChange={(date) => this.props.onDateChange(date)}

---

要将方法传递给子级，请删除.bindthis：

class Parent extends Component {
  constructor(props) {
  super(props);

this.state = {
  //some other props
  currentDate: moment()
};

componentDidMount() {
  this.fetchData();
}

fetchData() {
  this.setState({
    //set some state here
  });
  //Some Api call
}

onDateChange(currentDate) {
  this.setState({
    currentDate
  });
}
//doing some stuff to render a table
return (
  <div>
    <ChildComponent
      currentDate={this.state.currentDate}
      // Removed .bind(this)
      // added missing parameter
      onDateChange={(date) => this.onDateChange(date)}
    />
    {currentView}
  </div>
);
}

render() {
 return (
  <div>
    //renders table
  </div>
);

---

你能分享完整的文件吗，包括导入类和导出类

从这部分代码中，我可以看到一些问题：

两个类的构造函数都缺少一个结束括号； 父级//中的返回值做了一些事情来呈现表，但返回值放错了位置。是否要将其放入渲染方法中？ 也许是这样的

类父级扩展组件{ 构造器{ 超级作物； 此.state={ //其他一些道具 当前日期：时刻 }; } 组件安装{ 这是获取数据； } 获取数据{ 这是我的国家{ //在这里设定一些状态 }; //一些Api调用 } onDateChangecurrentDate{ 这是我的国家{ 当前日期 }; } 渲染{ //正在做一些渲染表的工作 回来 {currentView} {/*呈现表*/} ; } } 这里仍然缺少像这个currentView这样的片段，所以，如果你能提供更多的上下文，那就太好了

---

希望有帮助。

嗨，谢谢你的回复。我删除了绑定，得到了一个新的错误，方法onDateChange中的setState不是函数。但至少这给了我更多的工作机会。非常感谢。通过在构造函数中将onDateChange绑定到该函数，我能够消除setState不是函数错误。它仍然没有按预期工作，但我正在取得进展。Christiaan的回答显示了如何将缺少的日期参数传递给父组件的函数-我已将该参数添加到我的回答中。您好，@Typeset，我使用了您和Christiaan的回答，并更新了我的问题以反映。虽然还没有达到预期效果，但我正在取得进展。谢谢你们。嗨，克里斯蒂安，我编辑了我的问题，加入了你们的建议。它仍然没有像预期的那样工作，但我正在取得进展。谢谢。你弄明白了吗？@Typeset，由currentView，你的意思是currentDate吗？嗨，谢谢你的回答，大多数其他代码只是呈现表格的逻辑。它的实际功能是将日期发送到数据库，并基于该日期更改SQL查询，然后呈现这些记录的表。简言之，如果有今天的记录，则该表仅呈现不起作用的更改日期功能。

        onDateChange={(date) => this.props.onDateChange(date)}

class Parent extends Component {
  constructor(props) {
  super(props);

this.state = {
  //some other props
  currentDate: moment()
};

componentDidMount() {
  this.fetchData();
}

fetchData() {
  this.setState({
    //set some state here
  });
  //Some Api call
}

onDateChange(currentDate) {
  this.setState({
    currentDate
  });
}
//doing some stuff to render a table
return (
  <div>
    <ChildComponent
      currentDate={this.state.currentDate}
      // Removed .bind(this)
      // added missing parameter
      onDateChange={(date) => this.onDateChange(date)}
    />
    {currentView}
  </div>
);
}

render() {
 return (
  <div>
    //renders table
  </div>
);