Как положить sh данных в массив состояний в реагировать родной - PullRequest
Новая
       4

Как положить sh данных в массив состояний в реагировать родной

0 голосов
/ 20 января 2020

Предположим, у меня есть массив идентификаторов, которые отражают мои изображения [aaa, bbb, ccc], и я буду использовать эти данные для получения своих изображений.

Я хочу использовать эти идентификаторы и получать свои изображения и сохранять их в состояние массива, которое будет использоваться для отображения моих изображений в плоском списке.

Мой код выглядит следующим образом. 

 getIDs() {
        fetch(config)
            .then((response) => {
                 return response.json(); 
            })
            .then(async (data) => {
                data.map(async id => {
                    await this.setImages(id.id)
                }                    );})        }

    async setImages(imageID) {
        await fetch(config ) //where image Id is used
            .then((response) => {
                   return response.json(); 
                                 }                })
            .then(async (data) => {
 await this.setState({ images: this.state.images.concat(data.content), isLoading: false }   
            })

Проблема с этим setState заключается в том, что он меняет последовательность моих изображений. Я хочу загрузить свои изображения в определенной последовательности c, которую я получаю из базы данных.

Мой плоский список выглядит следующим образом 

                    <FlatList
                    data={[...this.state.images]}
                    numColumns={3}
                    renderItem={({ item, index }) => {
                        return (
                           <Image source={{ uri: 'data:image/png;base64,' + item }} />
                        );
                    }}
                    keyExtractor={(item, index) => index.toString()}
                />

1 Ответ

0 голосов
/ 20 января 2020

Вместо setState там для каждого изображения, сначала создайте массив, содержащий изображения и pu sh изображение там, чтобы не было никаких изменений в порядке и во время поиска сделать это, как вы делали 

let imagesArray=[];

getIDs() {


        fetch(config)
            .then((response) => {
                 return response.json(); 
            })
            .then(async (data) => {
                data.map(async id => {
                    await this.setImages(id.id)
                }                    ); 
              }
              this.setState({imagesArray:imagesArray})
              )        }

    async setImages(imageID) {
        await fetch(config ) //where image Id is used
            .then((response) => {
                   return response.json(); 
                                 }                })
            .then(async (data) => {
//  await this.setState({ images: this.state.images.concat(data.content), isLoading: false } 
imagesArray.push (data.content) 
            }) :,

надеюсь, это поможет

...