如何在 React Native 的 Flatlist 中傳遞數組以渲染

Question

我在 React Native 中渲染 Flatlist 時遇到問題。 該數組是來自 Google 表格通過 Node express 的 output。 數組示例是

[["Fateh","25"],["Fateh","100"],["Ambuja","140"],["Utcl","50"]]

到目前為止我已經嘗試過：

setDoList(() => {
                return [
                  {col1 : responseText[0], col2:responseText[1] ,key: Math.random().toString()}
                ]
              })

但是縮進在這里不起作用。 我什至嘗試使用 {... array} 將數組轉換為 JS 對象，但沒有幫助。 我是JS領域的新手，請為我提供解決這個問題的方向。

Answer 1

為了在平面列表中使用 arrays 數組，您可以執行以下操作

export default function App(){    

    const array = ['["Fateh","25"]','["Fateh","100"]','["Ambuja","140"]','["Utcl","50"]'];

      return(
        <View style={styles.div}>
          <FlatList
            data={array}
            renderItem={({ item,index }) => {
                console.log("item is",item);
                var array = JSON.parse(item);
        return(
            <View style={{flexDirection:"row"}}>
            {array.map((item, key) => 
            {
                return(
                <View>
                  <Text> {item} </Text>
                </View>
              )
            })}
            </View>
        )
        } }
            keyExtractor={item => item.id}
          />
        </View>
      );

    }

您可以為每個使用 FlatList，而不是在其中使用 map。

希望這可以幫助！

Answer 2

在 React Native 方面。 在嘗試訪問其屬性或方法之前，您如何使用 JSON.parse(data) 。

如果它是一個字符串，則需要使用 JSON.parse() 將其轉換為對象數組。

另外，在將數據發送到 React Native 之前，節點 js 服務器端的數據是什么樣的？ 我知道谷歌表格會做一些奇怪的事情