React Native State 未使用空数组进行更新

Question

嗨 stackoverflow 人我知道这已经被问了大约一百万次。 但是，我认为我没有找到问题的答案！

长话短说，仅当声明为真时，我才会在我的 react 本机应用程序中更新 state。 我遇到的是这个 state 没有以某种方式更新。

const emptyArray = []
const [collapsed, setCollapsed] = useState(true);
const [selectedGem, setSelectedGem] = useState(false);
const [usedGem, setUsedGem] = useState(emptyArray);
const [selectedPropType, setSelectedPropType] = useState('all');

const randomItem = (items) => {
    return items[Math.floor(Math.random()*items.length)];
}

const getRandomQuestion = () => {
    let selectableGems = gems

    const maxGems = selectableGems.length;
    let tempGems = [];

    if(usedGem.length >= maxGems) {
        setUsedGem(emptyArray)
    }

    for (let i=0; i<maxGems; i++)
    {
        if(usedGem.length === 0 || usedGem.find(gem => gem === i) === undefined) {
            tempGems.push(i)
        }
    }

    const randomGemNumber = randomItem(tempGems)

    setUsedGem([...usedGem, randomGemNumber])

    setSelectedGem(selectableGems[randomGemNumber])
}

基本上if(usedGem.length >= maxGems) {仅在所有宝石都被随机化一次时发生（ gems变量中有 130 个项目）。 我希望usedGem在for中为空，但事实并非如此。

我尝试了一些没有运气的解决方案。 我知道这与异步有关，但我想不通？ 任何人都可以帮助我吗？

Answer 1

在这里，这可能会有所帮助。 问题是设置 state 后您无法获得即时更新

const getRandomQuestion = () => {
let selectableGems = gems

const maxGems = selectableGems.length;
let tempGems = [];
let gems = Array.from(usedGem);

if(gems.length >= maxGems) {
    gems = []
}

for (let i=0; i<maxGems; i++)
{
    if(gems.length === 0 || gems.find(gem => gem === i) === undefined) {
        tempGems.push(i)
    }
}

const randomGemNumber = randomItem(tempGems)

setUsedGem([...gems, randomGemNumber])

setSelectedGem(selectableGems[randomGemNumber])
}