反应原生中未处理的承诺拒绝

Question

我收到未处理的承诺拒绝的警告，并且 undefined 不是评估 this.state.gridData[0].brand 的对象

这部分代码有问题

async componentDidMount() {
       const bikes = await fetchVehicleBasedOnType(VEHICLE_TYPES.TWO_WHEELER);
       this.setState({ bikes });
       const gridData = _.uniqBy(bikes, 'brand').map((K) => {
                return { brand: K.brand, logo: K.brand_logo };
                              });
       this.setState({ gridData,
                       selectedBikeBrand: this.state.gridData[0].brand,
                       selectedBikeBrandLogo: this.state.gridData[0].logo,
                       loading: false
                      });
        const listData = bikes
        .filter(item => item.brand === this.selectedBrand)
        .map(({ model, image }) => ({ model, modellogo: image }));
        this.setState({ listData });
  }

有人可以建议编辑和修复以使此代码更好..

Answer 1

您在设置状态时有 girdData[0].brand。

Answer 2

您没有将gridData 分配给this.state，因此推测this.state.gridData 是undefined。只需删除this.state 的使用。 在尝试访问 gridData[0] 上的属性之前，您还应该检查以确保 gridData 不为空。

const gridData = _.uniqBy(bikes, 'brand').map((K) => {
    return { brand: K.brand, logo: K.brand_logo };
});

const firstItem = gridData[0] || { };

this.setState({ 
    gridData,
    selectedBikeBrand: firstItem.brand,
    selectedBikeBrandLogo: firstItem.logo,
    loading: false
});