Разрешение «Объекты недопустимы как дочерний элемент React (найдено: [обещание объекта])» в функциональных компонентах - PullRequest
Новая
       10

Разрешение «Объекты недопустимы как дочерний элемент React (найдено: [обещание объекта])» в функциональных компонентах

0 голосов
/ 03 апреля 2020

У меня есть следующее в функциональном компоненте. 

const [trucks, setTrucks] = React.useState([]);

React.useEffect(() => {
    Request.getTrucksForToday().then((x) => {setTrucks(x)}); // <-- this is an async function to an axios request
});

return (
...

{trucks.map((truck) =>{return<LocalShippingIcon lat={truck.latitude} lng={truck.longitude} text={truck.name}/>})}
...
);

Все решения, которые я видел для этой проблемы, предлагают просто поместить функцию asyn c в componentDidMount() ( 1 *). 1006 *, 2 ). Есть ли способ решить это без этого?

для полноты здесь есть функция 

export function getTrucksForToday() {
  return axios({
    method: "GET",
    url: constants.backend_url + "schedule/getTrucksForToday",
    headers: request_headers
  })
    .then(function(response) {
      console.log(response.data);
      return response.data;
    })
    .catch(function(error) {
      console.log(error);
      return error;
    });
}

1 Ответ

0 голосов
/ 03 апреля 2020

Добавить [] для использованияEffect () 

const [trucks, setTrucks] = React.useState([]);

React.useEffect(() => {
    Request.getTrucksForToday().then((x) => {setTrucks(x)}); // <-- this is an async function to an axios request
},[]);

return (
...

{trucks.map((truck) =>{return<LocalShippingIcon lat={truck.latitude} lng={truck.longitude} text={truck.name}/>})}
...
);
...