TypeError: undefined is not an object (evalating 'icons.map') React-Native

Question

我正在嘗試從數組icons渲染一系列圖標，但是當我嘗試返回{icons.map((icon, index) =>(<Icon key = {index} icon={icon}/>))} ，我得到“typeError: undefined is not an object (evalating 'icons.map')”。

這是我正在使用的代碼：

const BottomTabs = ({ icons }) => {
    const [activeTab, setActiveTab]  = useState('Home')

    const Icon = ({icon}) => (
        <TouchableOpacity onPress = {() => setActiveTab(icon.name)}>
            <Image source = {icon.inactive} style= {styles.icon}/>
        </TouchableOpacity>
    )

    return (
        <View>
            { icons.map((icon, index) =>(
                <Icon key = {index} icon={icon}/>
            ))}
        </View>
    )
}

知道問題可能是什么嗎？

編輯：這就是我的數組通過組件傳遞的方式：

<BottomTabs icons = {bottomTabIcons}/>

這是數組本身的對象的示例：

const bottomTabIcons = [
    {
        name: 'Home',
        active: require('../../assets/home-active.png'),
        inactive: require('../../assets/home.png') 
    }
]

我是否錯誤地將數組通過我的BottomTabs組件？

Answer 1

您沒有將icons傳遞給BottomTabs組件。 檢查調用<BottomTabs icons={icons}>時是否正確傳遞圖標