相关疑难解决方法(0)

我尝试将一个函数传递给我的子组件.对于每个子组件,当用户单击它们时,将调用onclick函数.此onclick函数将写入父组件.

父组件:

class AgentsList extends React.Component {
  constructor(props) {
    super(props);
  }

  handleClick(e) {
    e.preventDefault();
    console.log(this.props);
  }

  render() {
    const { agents } = this.props;

    ...

    var agentsNodes = agents.map(function(agent, i) {
      if(agent.id_intervention == "") {
        return (
          <Agent agent={agent} key={i} ticket={t} id={row_names} onClick={this.handleClick.bind(this)} />
        );
      }
    });
    return (
      <div id="agents">
        <div className="agents-title">
          <h3>Title</h3>
        </div>
        {agentsNodes}
      </div>
    );
  }
}

子组件:

class Agent extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    const { agent, t } = this.props;

    return …

我从子组件中的父级调用函数“booksRefresh()”，但出现错误：

类型错误：booksRefresh 不是函数

我不知道为什么，因为 'booksRefresh' 是一个函数。有人可以帮我解释为什么会出现这个错误吗？

这是我的代码：

import React, {useState} from "react";
import {Redirect} from "react-router";
import {addBook} from "../api/api";
import {Button} from "react-bootstrap";

const AddBookForm = (booksRefresh) => {
    const [title, setTitle] = useState();
    const [description, setDescription] = useState();
    const [submitted, setSubmitted] = useState(false);

    const postRequestHandler = () => {
        addBook(title, description);
        booksRefresh();
    }
...
 return (
        ...
            <Button type="submit" onClick={postRequestHandler} variant="outline-success">Add</Button>
        </div>
    )

家长：

function App({history}) {
  ...
    const [changeInBooks, setChangeInBooks] = useState(0)

    const booksRefresh = () => …