如何在 React Native 中的 Text 中顯示數組中的鍵和值？

Question

我正在嘗試映射/循環遍歷我的數組，這樣我就可以在我的移動應用程序屏幕上顯示每個鍵和值。

這是我的數組

const getExpense = [{"fecha": "09", "text": "Comida", "value": 2896}, {"fecha": "09", "text": "Misc", "value": 1714}, {"fecha": "09", "text": "Transporte", "value": 1525}, {"fecha": "09", "text": "Salida", "value": 1260}, {"fecha": "09", "text": "Deporte", "value": 560}, {"fecha": "09", "text": "Farmacia", "value": 367}, {"fecha": "09", "text": "Pulperia", "value": 126}, {"fecha": "09", "text": "Ayuda", "value": 50}]

我做了一些研究，這是 function，我發現它可以為我工作到 map 超過每個 object。 它應該只適用於 1 個項目。 但我有 3 項：fecha、text 和 value。

function display(){
        return getExpense.map((item,item1,item2)=>{
            return(
                <RN.Text>
                    {item} {item1} {item2}
                </RN.Text>
            )
        })
    }

這是我的 RN 代碼，用於返回顯示 function。 我也嘗試將它退回，但沒有成功。

return(
    <RN.View>
        <RN.Text>
              {display()}
        </RN.Text>
    </RN.View>
)

它給了我這個問題：

渲染錯誤：對象作為 React Child 無效（發現：帶有鍵 {fecha, text, value} 的 object。如果您要渲染子集合，請改用數組。

任何幫助將不勝感激。

Answer 1

我能夠修復它。

我將 function 更改為對象鍵名，因此我使用值和文本（我的鍵名）代替了 item、item1、item2。

請看看有同樣問題的任何人。

function display(){
    return getExpense.map(({text, value})=>{
        return(
            <RN.Text>
                {text} : {value}
            </RN.Text>
        )
    })
}

Answer 2

    const getExpense = [{"fecha": "09", "text": "Comida", "value": 2896}, {"fecha": "09", "text": "Misc", "value": 1714}, {"fecha": "09", "text": "Transporte", "value": 1525}, {"fecha": "09", "text": "Salida", "value": 1260}, {"fecha": "09", "text": "Deporte", "value": 560}, {"fecha": "09", "text": "Farmacia", "value": 367}, {"fecha": "09", "text": "Pulperia", "value": 126}, {"fecha": "09", "text": "Ayuda", "value": 50}]

function display(){
        return getExpense.map((obj)=>{
            return(
                <RN.Text>
                  {Object.entries(obj).map(([key, value]) => `${key}: ${value}`).join(' ,')}
                </RN.Text>
            )
        })
    }
    
    console.log(display())