遇到两个具有相同密钥“%s”的孩子。密钥应该是唯一的,以便组件在更新中保持其身份

每当我回到主屏幕时,都会遇到此错误,并尝试了所有操作,因为我读到此错误与“平面列表”有关,所以我尝试更改keyExtractor = {(item,index)=> index.toString()},但它也不起作用。

How I can fix the following error: Encountered two children with the same key, %s. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.%s

这是我的代码。

  render()
  const chart_wh = 200
  const series = [18, this.state.totalleavestaken]
  const sliceColor = ['#58508d', '#ffa600']
  return (
    <Block style={styles.container}>
      <NavigationEvents
            onDidFocus={() =>  this.refreshfunction()}
            />
      <StatusBar
        barStyle="dark-content"
        hidden={false}
        translucent={true}
        networkActivityIndicatorVisible={true}
      />
      <Block row style={styles.profile}>
        <Text style={styles.heading} >{this.state.wishes} ,  </Text>
        <Text style={styles.heading} >{this.state.email}</Text>
      </Block>
      <View style={styles.leavesGraph}>
        <View style={styles.leavesAccured}>
          <Text style={styles.totalleavetext}>Total Leaves</Text>
          <Text style={styles.number}>18</Text>
        </View>
        <View style={styles.leavesUsed}>
          <Text style={styles.takenleavetext}>Leaves Used</Text>
          <Text style={styles.number}>{this.state.totalleavestaken}</Text>
        </View>
      </View>

      <Block style={styles.box}>
        <Block center style={styles.pie1}>
          <PieChart
            chart_wh={chart_wh}
            series={series}
            sliceColor={sliceColor}
            doughnut={true}
            coverRadius={0.85}
          />
        </Block>
      </Block>
      <View style={styles.elapseLeave}>
        <Text style={styles.paragraph}>{this.state.leavesleft} left out of 18</Text>
      </View>

      <Text style={styles.requestCaption}>Leave Request</Text>
      <FlatList
        style={styles.list}
        extraData={this.state}
        data={this.state.response}
        numColumns={5}
        renderItem={({ item , index }) => (
          <View style={styles.leavesdetail}>
            <View style={styles.leaveRequestSection}>
              <Text style={styles.leaveRequestsCaption} key={index}> 
                              {item.A}</Text>
        <Text style={styles.leaveRequests} key={index} >Number of days: {item.B}</Text>
            </View>

            <View style={styles.leavesUsed}>
              {this.leavesstatusrender(item.C)}
            </View>

          </View>
        )}
        keyExtractor={(item, index) => index.toString()}
      />


    </Block>
  );
}