javascript - Invariant Violation：对象作为 React 子对象无效（发现：具有键 {_40、_65、_55、_72} 的对象）

Question

我有一个平面列表，在平面列表中，每个项目都有地理位置。

我{this.getitemlocation(item.location)}从里面打电话Flatlist。这里getitemlocation()是函数，item.location是经度和纬度。

我的getitemlocation()：

 async getitemlocation(item) {
   let locationstring = item.split(",");
    if(locationstring[0]!="None"&&locationstring[1]!="None"){
    let location = {
      latitude: Number(locationstring[0]),
      longitude: Number(locationstring[1]),
    };
    itemloacation = await Location.reverseGeocodeAsync(location);
    return (
      <Text style={styles.itemLocation} key={item}>
        {itemloacation.name} {"\u2022"} 2.3 km
      </Text>
    );
    }
    else{
      return (
        <Text style={styles.itemLocation}>
          No Location
        </Text>
      );
    }
  }

我得到的错误：

Invariant Violation：对象作为 React 子对象无效（发现：具有键 {_40、_65、_55、_72} 的对象）。如果您打算渲染一组子项，请改用数组。

标签： javascriptreact-nativelocationexpo

Answer 1

你不能像那样返回异步函数。你可以像这样使用 Promise：

getitemlocation(item){
  return new Promise(async (resolve) => {
    let locationstring = item.split(",");
    if(locationstring[0]!="None"&&locationstring[1]!="None"){
      let location = {
        latitude: Number(locationstring[0]),
        longitude: Number(locationstring[1]),
      };
      itemloacation = await Location.reverseGeocodeAsync(location);
      resolve(
        <Text style={styles.itemLocation} key={item}>
          {itemloacation.name} {"\u2022"} 2.3 km
        </Text>
      )
    }else{
      resolve (
        <Text style={styles.itemLocation}>
          No Location
        </Text>
      );
    }
}