Question

import React, { Component } from 'react';

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

    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    console.log(this.props.idt);
  };

  render() {
    return (
      <div className='bookmark' onClick={this.handleClick()}/>
    );
  }
}
export default Bookmark;

这是我的代码。我已经绑定了该函数，但仍然在渲染时调用它。这也是他们在React文档中执行此操作的方式：https://facebook.github.io/react/docs/handling-events.html

只有这样做才有效：

<div className='bookmark' onClick={() => this.handleClick()}/>

然后只有在单击按钮时才会调用handleClick。

Answer 1

因为您正在传递方法调用而不是方法本身。

将其更改为

<div className='bookmark' onClick={this.handleClick}/>

为什么在渲染上调用onClick？

1 个答案: