如何在另一个内部使用嵌套的 renderItem 函数

Question

必须使用两个 renderitem 函数，外部一个是与平面列表相关的选项卡视图和内部一个。有可能实现这一点。我在 tabview 中有一系列可点击对象，并且再次以平面列表的形式可以点击。

  const renderItem = (item, index) => {
    var dataToRender = item["data"];
    const exchangeToRender = item["exchange"];
    const exchangeArrTorender = item["exchangeArr"];
    return (
      <ScrollView style={{ backgroundColor: "white" }}>
        <FlatList
          data={exchangeToRender}
          keyExtractor={(item, index) => index.toString()}
          contentContainerStyle={{
            justifyContent: "flex-start",
            flexDirection: "row",
            paddingHorizontal: 10,
          }}
          renderItem={({ item, index }) => (
            <TouchableOpacity
              onPress={() => {
                console.log(index);
                setindexExchange(index);
              }}
              style={{
                padding: 8,
                borderRadius: 40,
                backgroundColor: indexExchange == index ? "#C3D0D980" : "white",
                margin: 5,
              }}
            >
              <Text
                style={{
                  backgroundColor: "transparent",
                  fontSize: 10,
                  fontWeight: "800",
                }}
              >
                {item}
              </Text>
            </TouchableOpacity>
          )}
        />
        {dataToRender && dataToRender.length ? (
          <>
            <ScrollView
              horizontal={false}
              scrollEventThrottle={16}
              showsHorizontalScrollIndicator={false}
              bounces={false}
            >
              {dataToRender.map((item, index) => (
                <ListComponent
                  key={item.companyName}
                  data={item}
                  index={index}
                  // onClickSellButton={() => buySellRowAction(item, "SELL")}
                  // onClickBuyButton={() => buySellRowAction(item, "BUY")}
                  sendDataToMarketWatch={() => sendDataToMarketWatch(item)}
                  openInstrumentOverview={() => {
                    navigation.navigate("InstrumentOverview", {
                      instrumentData: item,
                    });
                  }}
                />
              ))}
            </ScrollView>
          </>
        ) : null}
      </ScrollView>
    );
  };

有什么办法，我们可以解决这类问题，或与此相关的任何参考资料。