为什么响应类型不同？

Question

我正在使用 React Native 构建一个简单的图库管理应用程序。在图库页面中，我调用了“FetchGallery”函数，并在那里得到了一些响应。

This is constructor part.

this.state = {
  mainGalleryData: [
    {
      bg_url: '',
      country_id: 0
    }
  ],
};

That is the code for response.

  _onFetchGalleryBySite = (e) => {
    fetch(config.api.getGalleryInfo + '/' + e, {
      method: 'GET',
      headers: this.state.myHeaders
    })
      .then((response) => response.json())
      .then((responseJSON) => {
        console.log('resJSON=>', responseJSON['gallery_list']);  // => log is in the below.
        responseJSON['gallery_list'].map(item => {
          if (item != "") {
            let obj = {}
            obj.bg_url = item.bg_url
            obj.country_id = item.country_id
            this.state.mainGalleryData.push(obj)
          }
        })
      })
      .catch(err => console.log('_onFetchGalleryInfoErr=>', err))
  }

This is the log of fetched data

resJSON => [{ "bg_url": "staff_upload/bgremoval_20201008030228.png", "country_id": "3" },  
            { "bg_url":"Guest/1/image/bgremoval_20201004222851.png", "country_id": "3" }]

在 render() 中，我在 flatList

中使用了这些数据

That is the code for FlatList

    <FlatList
      data={mainGalleryData}
      renderItem={this.renderGallery}
      keyExtractor={(item, index) => index.toString()}
    />

This is the renderGallery.

  renderGallery = (item) => (
    <TouchableOpacity onPress={() => console.log('itemClicked=>', item)} style={styles.overlay}>
      <Image source={newImg} style={styles.newImg} />
      {
        this.state.gallery_id == item.location_id ?
          <Text style={{ fontWeight: '700' }} numberOfLines={1}>{item.item.title}</Text>
          :
          <Text style={{ fontSize: 12 }} numberOfLines={1}>{item.item.title}</Text>
      }
    </TouchableOpacity>
  )

当我单击其中一个数据时，我想获取此数据。但是结果和我想象的不一样。

I want:  { "bg_url": "staff_upload/bgremoval_20201008030228.png", "country_id": "3" } 
result:  { "index": 2, "item": {"Guest/1/image/bgremoval_20201004222851.png", "country_id": "3"}}

所以我必须用“item.item.country_id”得到 country_id。

我想用“item.country_id”获得country_id。

这是什么 <"index": 2> ？

Answer 1

Before pushing response in state, please clear "mainGalleryData[]" because default it has 1 item in state which makes index inappropriate.

这样做

console.log('resJSON=>', responseJSON['gallery_list']);
const responseData = responseJSON['gallery_list'];
const data = this.state.mainGalleryData.concat(responseData); <-- add this line -->
this.state({ mainGalleryData: data });

为什么响应类型不同？

Why response type is different?

response

fetch

react-native