CODEWITHSUNDEEP
reactjsreact-nativereact-native-flatlist
Chheangly Prum
Chheangly Prum

Reputation: 185

React Native Get Flatlist Index

I use flatlist inside flatlist and i want to get index of first flatlist that i used
code below:

<FlatList
  data ={this.state.data}
  renderItem = {(item, index1)=>
    <View>
      <FlatList
        data = {this.state.data2}
        renderItem = {(item, index2) => 
          console.log("parent_index",index1);
          console.log("child_index",index2);
        }
      />
    </View>
  }

How can i get index1?
What i did in code above is undefind.

Upvotes: 2

Views: 2895

Answers (3)

Kubilay Kiymaci
Kubilay Kiymaci

Reputation: 472

You should use keyExtractor prop of FlatList. 

<FlatList
  data ={this.state.data}
  keyExtractor={(item, index) => index}
  renderItem = {(item, index)=>
    <View>
      <FlatList
        data = {this.state.data2}
        renderItem = {(item, index) => 
          console.log("parent_index",index);
        }
      />
    </View>
  }

Upvotes: 1

RB RB
RB RB

Reputation: 166

Code for first flatlist

render() {
    return (
        <View style={{ height: "100%", width: "100%", backgroundColor: 'red' }}>
          <FlatList
            data={this.state.data}
            renderItem={({ item, index }) => {
              return (
                this.renderSecondFlatlist(index)
              );

            }
            }
          />
        </View>
    )
  }

Code for second flatList, where you will pass "index" of first FlatList

 renderSecondFlatlist(index1) {
        return (
          <View style={{ flex: 1, backgroundColor: 'pink' }}>

            <FlatList
              data={this.state.data2}
              renderItem={(item, index2) => {
                /*return (
                  <Text>{index1}</Text>
                );*/
                console.log("index:-",index1);
              }
              }
            />
          </View>
        );
      }

Upvotes: 3

Senior Tomato
Senior Tomato

Reputation: 23

U need handler that onPress will get index, like:

onPress={()=>this.getItem(index)} And handler:

getItem=index=>this.setState(prevState=>({selectedByIndex:[index, ...prevState.selectedByIndex]})

Upvotes: 1

Related Questions