Мой React useState не может сразу установить объект в useEffect. Кто-нибудь может мне помочь?

Question

Спасибо за ваш интерес. Я разрабатываю веб-сайт Laravel с React. js в качестве внешнего интерфейса с использованием laravel mix. Я пытаюсь загрузить объект, который должен был быть обработан извлеченными данными из React.useEffect , чтобы установить некоторые из моих React.useState. Я пытался протестировать функцию set, но объекты выбираются не с первой попытки. Когда я запускаю программу, она показывает «компонент равен нулю». Ниже я вставил фрагмент. Вы можете мне помочь?

function Users() {
  const [users, setUsers] = React.useState([]);
  const [rolesDict, setRoles] = React.useState({});

  React.useEffect(() => {
          const fetch = async () => {
              setFetchStatus(SUBMIT_LOADING);
              try {
                  const [usersResponse, rolesResponse] = await Promise.all([
                      rootApi.get('/users'),
                      rootApi.get('/roles'),
                  ]);
                  setRoles(_.mapKeys(rolesResponse.data, 'code'));
                  setUsers(usersResponse.data);
                  setFetchStatus(SUBMIT_DONE);
              } catch (error) {
                  console.log({error});
                  setFetchStatus(SUBMIT_FAIL);
              }
          };
          fetch();
      }, []);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

Answer 1

http вызовы asynchrouns попробуйте использовать async и await при set функции