如何通過FlatList獲取當前索引？

我正在使用導航引數將資料傳遞到詳細資訊螢屏，一切正常，我想將點擊的當前級別索引傳遞給唯一的東西，我Object.entries[currentIndex]不知道我怎樣才能得到它。

<FlatList
          data={data}
          keyExtractor={(item) => item.index}
          renderItem={({ item, index }) => (
            <View>
              {item.sTask?.map((levels, i) => (
                <View>
                  <TouchableOpacity
                    onPress={() => navigation.navigate('Tasks', { item })}
                    style={{
                      backgroundColor: '#33333325',
                      paddingHorizontal: 20,
                      paddingVertical: 10,
                      borderRadius: 10,
                      marginVertical: 20,
                      marginHorizontal: 20,
                    }}
                  >
                    <Text>{Level 1}</Text>
                  </TouchableOpacity>
                   
                   <TouchableOpacity>
                     {Another level...}
                   </TouchableOpacity>
                </View>
              ))}
            </View>
          )}
        />

詳情畫面：

  const [currentTaskGroupIndex, setCurrentTaskGroupIndex] = useState(0); <---- We need to set current index somehow to current clicked index

  //Test item params data
  useEffect(() => {
    const mapData = item?.sTask?.map((tasks) => {
      return Object.entries(tasks)[currentTaskGroupIndex].map((level) => {
        // console.log(level);
      });
    });
  }, [item]);

無論我點擊哪個級別，我都會獲得 1 級詳細資訊

uj5u.com熱心網友回復：

你需要這樣做：

 onPress={() => navigation.navigate('Tasks', { item:item, index:i })}

然后在詳細資訊螢屏中：

const indexParam = props?.route?.params?.index ?? 0

const [currentTaskGroupIndex, setCurrentTaskGroupIndex] = useState(indexParam); <---- We need to set current index somehow to current clicked index

  //Test item params data
  useEffect(() => {
    const mapData = item?.sTask?.map((tasks) => {
      return Object.entries(tasks)[currentTaskGroupIndex].map((level) => {
        // console.log(level);
      });
    });
  }, [item]);

希望能幫助到你。隨時懷疑

uj5u.com熱心網友回復：

您可以在導航引數中傳遞任務的索引

onPress={() => navigation.navigate('Tasks', { item, index: i })}

現在，您無需 map() 即可找到您的任務

const mapData = item?.sTask[index]

您可以在導航引數中傳遞整個物件

uj5u.com熱心網友回復：

謝謝你們的回答，你是對的，而且我還添加了另一個 Object.key().map 并且它有效

{item.sTask?.map((levels, i) => (
                <View key={i}>
                  {Object.keys(levels).map((key, i) => (
                    <View key={i}>
                      {console.log(key)}
                      <TouchableOpacity
                        onPress={() =>
                          navigation.navigate('Tasks', { item: item, index: i })
                        }
                        style={{
                          backgroundColor: '#33333325',
                          paddingHorizontal: 20,
                          paddingVertical: 10,
                          borderRadius: 10,
                          marginVertical: 20,
                          marginHorizontal: 20,
                        }}
                      >
                        <Text>{key}</Text>
                      </TouchableOpacity>
                    </View>
                  ))}
    ```

標籤：反应式反应本机平面列表路由参数

上一篇：首次啟動AndroidStudio時AndroidSDK不可用

下一篇：無法重用我的組件，它只顯示1次