无法在React

Question

我有一个名为Likes的无状态功能组件。在其中，我有两个功能：handleLikePlus()和handleLikeMinus()。我想在点击Likes组件中的向上或向下箭头时分别触发它们中的每一个。

以下是我的组件的代码

function Likes( {likes} ) {
   function handleLikePlus() {
      this.setState({
         likes: this.state.likes + 1
      });
   };
   function handleLikeMinus() {
      this.setState({
         likes: this.state.likes - 1
      });
   };
   return (
      <div>
         <div onClick={this.handleLikePlus()}>
            <h5><i className="fa fa-arrow-up" aria-hidden="true"></i></h5>
         </div>
         <div>
            <h4>{likes}</h4>
         </div>
         <div onClick={this.handleLikeMinus()}>
            <h5><i className="fa fa-arrow-down" aria-hidden="true"></i></h5>
         </div>
      </div>
   );
}

我的控制台返回：

Uncaught TypeError: cannot read property 'handleLikePlus' of undefined

我哪里错了？这是一个简单的语法错误吗？或者我是以错误的方式调用函数？

提前致谢。

Answer 1

您正在使用无状态组件，但您仍然在尝试使用setState() - 这不会起作用。如果您需要状态，请使用普通组件。

此外，由于错误读取，handleLikePlus无法从this访问，因为您的函数中没有this。