Javascript React JS：在onClick事件中调用两个函数不会运行函数

我用的是React和React-Spring。React-spring有一个切换功能，基本上可以在单击时最大化窗口。看起来是这样的：

class Projects extends Component {

constructor() {
    super()
    this.state = {
      instructions: true,
      data: ''
    }
  }

  handleClick ()  {
    console.log('hello world');
    this.setState({
      instructions: false
    });
    console.log(this.state.instructions);
    return true;
  }

  render() {
    return (
       {this.state.instructions && (
          <div className="projects-instructions">
             Instructions here
          </div>
       )}
       <Grid
            className="projects"
            data={data}
            keys={d => d.name}
            heights={d => d.height}
            columns={2}>
            {(data, maximized, toggle) => (
                  <div onClick={()=>{
                         return data.clicks ? toggle() : false
                       }}>
                  </div>
            )}
       </Grid>
    );
  }
}
export default Projects;

问题是

this.handleClick.bind（this）

从未运行。console.log甚至不运行

---

我应该怎么做

绑定

此

函数不会调用该函数。它只是指定在该函数中使用时此所指的内容。在构造函数中绑定到

this

，然后在

onClick

事件中，只需正常调用函数（即

this.handleClick（）

）

类项目扩展组件{
构造函数（）{
超级（）；
此.state={
说明：正确，
数据：“”
}
//这就是将'this'绑定到方法的地方
this.handleClick=this.handleClick.bind（this）；
}
handleClick（）{
log（'helloworld'）；
这是我的国家({
说明：错误
});
console.log（this.state.instructions）；
返回true；
}
render（）{
返回(
{this.state.instructions&&(
这里的说明
)}
d、 名称}
高度={d=>d.height}
列={2}>
{（数据，最大化，切换）=>(
{
这个。handleClick（）；
返回数据。单击？切换（）：false
}}>
)}
);
}
}
导出默认项目；

将函数绑定到此通常在构造函数中完成。您确定要在

onClick

功能中执行此操作吗？也许你想做的是

this.handleClick（）？就是这样。非常感谢你！我还没有反应过来，非常困惑。
onClick={()=>{
                  this.handleClick.bind(this);
                  return data.clicks ? toggle() : false;
                }}

class Projects extends Component {

  constructor() {
    super();
    this.state = {
      instructions: true,
      data: ''
    }

    //this is where you bind `this` to methods
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick ()  {
    console.log('hello world');
    this.setState({
      instructions: false
    });
    console.log(this.state.instructions);
    return true;
  }

  render() {
    return (
       {this.state.instructions && (
          <div className="projects-instructions">
             Instructions here
          </div>
       )}
       <Grid
            className="projects"
            data={data}
            keys={d => d.name}
            heights={d => d.height}
            columns={2}>
            {(data, maximized, toggle) => (
              <div onClick={()=>{
                this.handleClick();
                return data.clicks ? toggle() : false
              }}>
              </div>
            )}
       </Grid>
    );
  }
}
export default Projects;