我的React useState无法在useEffect中立即设置对象。有人可以帮我吗？

Question

感谢您的关注。我正在使用laravel mix开发一个以Laravel为前端的React.js网站。我正在尝试加载应该由React.useEffect提取的数据呈现的对象，以设置一些React.useState。我尝试测试set函数，但不是第一次尝试就获取了对象。当我运行程序时，它显示“ component is null”。我在下面插入了代码段。你能帮我吗？

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