我试图在ReactJS中切换组件的状态，但收到一个错误，说明：

超过最大更新深度。当组件在componentWillUpdate或componentDidUpdate内重复调用setState时，可能会发生这种情况。React限制嵌套更新的数量以防止无限循环。

我在代码中没有看到无限循环，有人能帮忙吗？

ReactJS组件代码：

import React from 'react' 
    
import Buttonevent from './buttonevent.js'
    
class Button extends React.Component {
  constructor (props) {
    super(props);
    this.state = {counter: 0};
  }
    
  clickHandler() {    
    this.setState({
      counter: this.state.counter+1
    }, function () {
      console.log (" Job done");
    });  
  }
  
  render() {
    return(   
      <div classname="app">  
        <div classname="click-count">
          Button presses: {this.state.count}
        </div>
    
        <button onClick= {this.clickHandler.bind(this)}> Add one</button>
    
        <Buttonevent></Buttonevent>
    
      </div>
    );
  }
}
export default Button;

import React, { Component } from 'react';
    
class Buttonevent extends React.Component {
  constructor() {
    super();
    this.state = { buttontext: "Click me Please"};
    this.handleClick = this.handleClick.bind(this);
  }
    
  handleClick() {
    this.setState(() => {
      return { buttontext: "Thanks, Button has been clicked !"}
    });
  }
        
  render() {
    const {buttontext} = this.state
    return <button onClick ={this.handleClick()} > {buttontext} </button>    
  }
}
export default Buttonevent;