Question

在设置状态时，尽管数组的偶数长度为9，但它仅显示第一个值。我不确定它出了什么问题。

_GoTown = () => {
    if (this.state.stTownRawData == '') {
        alert(i18n.t('plsseltown'));
    }
    else {
        this.setState({ stAtmList: [] });
        var rartown = this.state.stTownRawData;
        for (i = 0; i < rartown.length; i++) {
            console.log(i);
            this.setState({ stAtmList: this.state.stAtmList.concat({ key: i, town: i18n.t('town') + rartown[i].town, address: i18n.t('add') + rartown[i].addressLine1, lat: rartown[i].latitude, long: rartown[i].longitude, icon: require('../../resources/toolbar/atm.png') }) });
        }
        console.log(rartown);
    }
}

Console.log（i）返回0到8之间的值。我不确定为什么setState只用第一个值填充stAtmList。

Answer 1

setState是异步的，所以即使您在第一行中将值设置为[]，它也是没必要在下一行中获得更新的值。

问题是，您正在循环中更新状态值，因此无法保证在下一个迭代状态中将具有更新的值。使用变量并推送其中的所有值，并在结束时更新状态意味着for循环结束。

你需要这样写：

_GoTown = () => {
    if (this.state.stTownRawData == '') {
        alert(i18n.t('plsseltown'));
    }
    else {
        let stAtmList = []
        let rartown = this.state.stTownRawData;
        for (let i = 0; i < rartown.length; i++) {
            stAtmList.push({ key: i, town: i18n.t('town') + rartown[i].town, address: i18n.t('add') + rartown[i].addressLine1, lat: rartown[i].latitude, long: rartown[i].longitude, icon: require('../../resources/toolbar/atm.png') }) });
        }
        this.setState({ stAtmList });
    }
}

查看此答案以获取更多详细信息：

Why calling setState method doesn't mutate the state immediately?

setState Concat仅存储/返回第一个值 - React Native

1 个答案: