react-native flatlist — keyExtractor возвращает повторяющийся элемент и переходит к концу массива данных

Сообщаю о странном поведении здесь, надеюсь, кто-то сталкивался с этим. Я получаю сообщение об ошибке «Нарушение инварианта: VirtualizedList содержит ячейку, которая сама содержит более одного VirtualizedList той же ориентации, что и родительский список. Вы должны передать уникальное свойство listKey каждому сестринскому списку».

Использование реакции родной 0.55.4

return (
        <View style={{ flex: 1 }}>
            <FlatList
                data={data}
                keyExtractor={(item, index) => {
                    console.log(`${item}-${index}`)
                    return `${item}-${index}`;
                }}
                renderItem={this.renderItem}
                getItemLayout={this.getItemLayout}
                ItemSeparatorComponent={HairSpacer}
            />
        </View>
    );

данные:

["korbit", "kraken", "bitstamp", "bitflyer", "bittrex", "bitfinex", "poloniex", "huobi", "zaif", "coincheck", "bithumb", "coinnest", "btcbox", "okcoin", "aex", "binance", "coinbase", "coinrail", "upbit", "coinone", "kucoin", "gate", "zb", "coin", "gopax"]

консоль:

kraken-1 
bitstamp-2 
bitflyer-3 
bittrex-4 
bitfinex-5 
poloniex-6 
huobi-7 
zaif-8 
coincheck-9 
coincheck-9 
gopax-24

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

Приветствуются любые советы


react-native react-native-flatlist
person ionush    schedule 21.05.2018    source источник
comment
я запустил приведенный выше код, который вы упомянули, но я не столкнулся с какой-либо проблемой, о которой вы упомянули. Можете ли вы предоставить другие сведения о классе компонентов, который вы создали.   -  person Prince    schedule 22.05.2018
comment
Эй, принц, спасибо за ваш ответ. Это просто слишком много кода для загрузки, потому что он вызывает данные из хранилища mobx, и это Flatlist, вложенный в компонент нижнего колонтитула другого Flatlist. Странно то, что этот компонент в другом месте вызывается точно так же и работает. При дальнейшем расследовании кажется, что в случае с ошибкой вызывается функция getNestedChildState в React-Native VirtualizedList.js, хотя ее нет в другом.   -  person ionush    schedule 22.05.2018
comment
хорошо, у меня тот же вопрос, может быть, это поможет вам which-it?rq=1" title="нарушение инварианта вложенного плоского списка виртуализированный список содержит ячейку, которую он">stackoverflow.com/questions/49276526/   -  person Prince    schedule 23.05.2018

Ответы (1)


arrow_upward
-2
arrow_downward

Попробуйте использовать listkey вместо keyExtractor

person Rotem Shaanan    schedule 02.09.2018