Question

在使用setState更新状态之后，如果我记录了state，即使状态不为空，我也会得到空数组。

我有如下代码所示的钩子。

    const [pets, setPets] = useState([]);

 async function requestPets() {
    const { animals: animalsProperty } = await pet.animals({
      location,
      breed,
      type: animal
    });

    console.log(animalsProperty);

    setPets(animalsProperty || []);
    console.log(pets);
  }

在使用animalsProperty设置setPets之后，在requestPets函数内部，即使animalsPreprty不为null，当我登录宠物时，我在控制台中看到空数组。我可以知道为什么为什么在我登录宠物时宠物显示空数组而不是像animalsProperty这样的值吗？

Answer 1

您能否使用回调函数来查看其是否正常工作

  setwww(b=>
            {
                return b||[];
            });

Answer 2

我认为pets将在render函数中按预期进行更新。
触发setPets后，它不会立即更新pets的值。换句话说，您将在该渲染中获得相同的pets值。下面显示了序列：

===初始渲染：===
1. Pets是[]
2. setPets（somePets）=>触发重新渲染
3. Pets是[]

===重新渲染：===
4. Pets是somePets

Answer 3

setPets会进行异步更新，因此如果您在设置状态值后立即console.log，将显示先前的值，因为它将在后续组件的渲染中更新。

更新状态后，使用set，状态仍为空数组

3 个答案: