Resolving Promise Array

Question

Я использую ReactJS и топор ios Я пытаюсь получить данные клиента

Реагировать: 16.5.2
ax ios: 0.18.0

У меня есть класс с конструктором:

constructor(props) {
  super(props);
  this.state = {
    reactTable: reactTableData(),
    reactBootstrapTable: reactBootstrapTableData(),
    dataCustomer: customerData(),
};

метод customerData () :

export function customerData(){
  // axios get  
  return axios.get("my/url")
  .then(res => {
    let data = res.data.data;
    console.log(data);
    return data
  })
  .catch(err => {
    console.log(err);
  })
}

когда я console.log(this.state); Я получил Обещание такие данные:

Я все еще новый с ReactJS и я надеюсь, что вы можете мне помочь,
спасибо.

Answer 1

Это в значительной степени нормально, потому что вы возвращаете обещание из вашей функции customerData. Я бы решил вашу проблему так:

constructor(props) {
  super(props);
  this.state = {
    reactTable: reactTableData(),
    reactBootstrapTable: reactBootstrapTableData(),
    dataCustomer: [],
  }
  this.initCustomerData()
}

async initCustomerData() {
  this.setState({
    customerData: await customerData()
  })
}

Answer 2

constructor(props) {
  super(props);
  this.state = {
    reactTable: reactTableData(),
    reactBootstrapTable: reactBootstrapTableData(),
  };

  this.initCustomerData();
}

initCustomerData = () => {
  customerData().then((data) => {
   this.setState({ dataCustomer: data })
  });
}

Answer 3

Your customerData вернет только Обещание, которое необходимо решить. Это обещание устанавливается в dataCustomer.

. Вы можете вызвать метод customerData внутри другого метода, который может быть вызван из constructor, или любого другого метода жизненного цикла. Разрешите обещание и затем вызовите метод setState, чтобы установить желаемое значение.