Изменение состояния установки в цикле жизни жизненного цикла компонента Js

Я скопирую ваш код и сделал все, что мог, с этим кодом, он, вероятно, сработает, но если вы не с этим примером, вы поймете, как написать свой код для работы, как вы ожидаете.

getInfoDashBoard = () => {

let monthWiseAmountPayment = [];
let monthWiseAmountPaymentMonth = [];
let invPaid = 0;
let invUnpaid = 0;
let invOverdue = 0;
axios.get("http://localhost:5000/dashboard").then(response => {
let Mrr = response.data.payment.total_count * response.data.payment.total_payment_amount) / 1000;   

response.data.payment.month_wise.map(element => {
  let month = moment(element.month, "YYYY/MM").month();
  let formattedMonth = moment()
    .month(month)
    .format("MMMM")
    .toUpperCase();
  monthWiseAmountPayment.push(element.amount);
  monthWiseAmountPaymentMonth.push(formattedMonth);   
});

 this.setState({...this.state, monthlyRecurringRevenue: Mrr, 
    etRevenue: response.data.payment.total_payment_amount
    ,playerActive: response.data.organization.enrollments[1]
    ,playerEnded: response.data.organization.enrollments[3]
    ,playerInActive: response.data.organization.enrollments[5]
    ,monthWiseAmountPayment: monthWiseAmountPayment
    ,monthWiseAmountPaymentMonth: monthWiseAmountPaymentMonth
    ,monthWiseAmountPaymentMonthCopy: monthWiseAmountPaymentMonth
     });
});
}

componentDidMount() {
  this.getInfoDashBoard();
}

   handleMonth = (event) => {
   let month = event.target.value;     
   let monthWiseAmountPaymentMonth_ = [];
   let month = moment(month, "YYYY/MM").month();
   let formattedMonth = moment()
    .month(month)
    .format("MMMM")
    .toUpperCase();    

  monthWiseAmountPaymentMonth_ = monthWiseAmountPaymentMonthCopy.filter((item) => {
                                     if(item === formattedMonth) 
                                      {
                                          return item;
                                      }
                                    }
                                 );

     this.setState({selectedMonth: month, 
monthWiseAmountPaymentMonth: monthWiseAmountPaymentMonth_})
}


<select 
    value={this.state.selectedMonth} 
    onChange={(e) => {this.handleMonth(e)}
    class="custom-select custom-select-md" 
    style= {{position:"absolute",width:"134px",  
       marginRight:"27px",marginLeft:"905px",
       marginTop:"30px",borderRadius:"3px",
       backgroundColor:"#d8d5cf" }}>
      <option selected value="">select month</option>
      <option value="January">January</option>
      <option value="February">February</option>
      <option value="March">March</option>
      <option value="April">April</option>
      <option value="May">May</option>
      <option value="June">June</option>
      <option value="July">July</option>
      <option value="August">August</option>
      <option value="September">September</option>
      <option value="October">October</option>
      <option value="November">November</option>
      <option value="December">December</option>
  </select>

Вам нужно интегрировать eventListener в выпадающем списке, ожидая события изменения. Что-то вроде этого:

render() {
  return(
    <div>
      <select onChange={this.handleChange}>
        ...
      </select>
    </div>
  )
)}
handleChange(event){
  const selectedItem = event.target.value;
  // Change your state here:
  this.setState({selection: selectedItem});
}

Является ли backend API возвратом объекта Json? Если «да», то вызов API в конструкторе, а не в функции componentDidMount.

Пример примера выборки ответа, не отображающий