How to fix Maximum update depth exceeded error in componentDidUpdate?

Question

React

constructor(props) {
    super(props)
    this.state = {
      battery: this.props.data.battery,
      network: this.props.data.network
    }
  }
componentDidMount() {
    this.batteryCharge();
  }
  componentDidUpdate(prevProp, prevState) {
    if ( this.state.battery !== prevProp.data.battery) {
      this.batteryCharge();
    }
  }
batteryCharge() {
    switch (this.state.battery) {
      case 11:
        this.setState({ battery: '---' })
        break;
      case 10:
        this.setState({ battery: '----' })
        break;
 default:
        break;
    }
}