javascript - 遍历 React 中的对象

问题描述

我很确定我的问题是一个初学者问题，并且有很多答案。

我定义了这个对象（Country.js）：

const Country = {
    albania:
    {
        'countryNo': 70,
        'name': 
        {
            de: 'Albanien',
            en: 'Albania',
            pl: 'Albania',
        },
    },
    austria:
    {
        'countryNo': 38,
        'name': 
        {
            de: 'Österreich',
            en: 'Austria',
            pl: 'Austria',
        },
    },
    belgium:
    {
        'countryNo': 2,
        'name': 
        {
            de: 'Belgien',
            en: 'Belgium',
            pl: 'Belgia',
        },
    },
    bosniaAndHerzegovina:
    {
        'countryNo': 93,
        'name': 
        {
            de: 'Bosnien und Herzegowina',
            en: 'Bosnia and Herzegovina',
            pl: 'Bośnia i Hercegowina',
        },
    }, 
    bulgaria:
    {
        'countryNo': 68,
        'name': 
        {
            de: 'Bulgarien',
            en: 'Bulgaria',
            pl: 'Bulgaria',
        },
    }, 
    croatia:
    {
        'countryNo': 92,
        'name': 
        {
            de: 'Kroatien',
            en: 'Croatia',
            pl: 'Chorwacja',
        },
    }, 
    czechRepublic:
    {
        'countryNo': 61,
        'name': 
        {
            de: 'Tschechische Republik',
            en: 'Czech Republic',
            pl: 'Czechy',
        },
    }, 
    denmark:
    {
        'countryNo': 8,
        'name': 
        {
            de: 'Dänemark',
            en: 'Denmark',
            pl: 'Dania',
        },
    }, 
    eire:
    {
        'countryNo': 7,
        'name': 
        {
            de: 'Irland',
            en: 'Eire',
            pl: 'Irlandia',
        },
    }, 
    estonia:
    {
        'countryNo': 53,
        'name': 
        {
            de: 'Estland',
            en: 'Estonia',
            pl: 'Estonia',
        },
    }, 
    finland:
    {
        'countryNo': 53,
        'name': 
        {
            de: 'Finnland',
            en: 'Finland',
            pl: 'Finlandia',
        },
    }, 
    finland:
    {
        'countryNo': 32,
        'name': 
        {
            de: 'Finnland',
            en: 'Finland',
            pl: 'Finlandia',
        },
    }, 
    france:
    {
        'countryNo': 1,
        'name': 
        {
            de: 'Frankreich',
            en: 'France',
            pl: 'Francja',
        },
    }, 
    germany:
    {
        'countryNo': 4,
        'name': 
        {
            de: 'Deutschland',
            en: 'Germany',
            pl: 'Niemcy',
        },
    }, 
    greatBritain:
    {
        'countryNo': 6,
        'name': 
        {
            de: 'Großbritannien',
            en: 'Great Britain',
            pl: 'Wielka Brytania',
        },
    }, 
    greece:
    {
        'countryNo': 9,
        'name': 
        {
            de: 'Griechenland',
            en: 'Greece',
            pl: 'Grecja',
        },
    }, 
    hungary:
    {
        'countryNo': 64,
        'name': 
        {
            de: 'Ungarn',
            en: 'Hungary',
            pl: 'Węgry',
        },
    }, 
    iceland:
    {
        'countryNo': 24,
        'name': 
        {
            de: 'Island',
            en: 'Iceland',
            pl: 'Islandia',
        },
    }, 
    india:
    {
        'countryNo': 664,
        'name': 
        {
            de: 'Indien',
            en: 'India',
            pl: 'Indie',
        },
    }, 
    italy:
    {
        'countryNo': 5,
        'name': 
        {
            de: 'Italien',
            en: 'Italy',
            pl: 'Włochy',
        },
    }, 
    kosovo:
    {
        'countryNo': 95,
        'name': 
        {
            de: 'Kosovo',
            en: 'Kosovo',
            pl: 'Kosowo',
        },
    },
    latvia:
    {
        'countryNo': 54,
        'name': 
        {
            de: 'Lettland',
            en: 'Latvia',
            pl: 'Łotwa',
        },
    },
    lithuania:
    {
        'countryNo': 55,
        'name': 
        {
            de: 'Litauen',
            en: 'Lithuania',
            pl: 'Lithania',
        },
    },
    luxemburg:
    {
        'countryNo': 960,
        'name': 
        {
            de: 'Luxemburg',
            en: 'Luxemburg',
            pl: 'Luksemburg',
        },
    },
    macedonia:
    {
        'countryNo': 96,
        'name': 
        {
            de: 'Mazedonien',
            en: 'Macedonia',
            pl: 'Macedonia',
        },
    },
    moldova:
    {
        'countryNo': 74,
        'name': 
        {
            de: 'Republik Moldau',
            en: 'Moldova',
            pl: 'Mołdawia',
        },
    },
    montenegro:
    {
        'countryNo': 97,
        'name': 
        {
            de: 'Montenegro',
            en: 'Montenegro',
            pl: 'Montenegro',
        },
    },
    morocco:
    {
        'countryNo': 97,
        'name': 
        {
            de: 'Marokko',
            en: 'Morocco',
            pl: 'Maroko',
        },
    },
    netherlands:
    {
        'countryNo': 3,
        'name': 
        {
            de: 'Niederlande',
            en: 'Netherlands',
            pl: 'Holandia',
        },
    },
    norway:
    {
        'countryNo': 28,
        'name': 
        {
            de: 'Norwegen',
            en: 'Norway',
            pl: 'Norwegia',
        },
    },
    poland:
    {
        'countryNo': 60,
        'name': 
        {
            de: 'Polen',
            en: 'Poland',
            pl: 'Polska',
        },
    },
    portugal:
    {
        'countryNo': 10,
        'name': 
        {
            de: 'Portugal',
            en: 'Portugal',
            pl: 'Portugalia',
        },
    },
    romania:
    {
        'countryNo': 66,
        'name': 
        {
            de: 'Rumänien',
            en: 'Romania',
            pl: 'Rumunia',
        },
    },
    serbia:
    {
        'countryNo': 94,
        'name': 
        {
            de: 'Serbien',
            en: 'Serbia',
            pl: 'Serbia',
        },
    },
    slovakia:
    {
        'countryNo': 63,
        'name': 
        {
            de: 'Slowakei',
            en: 'Slovakia',
            pl: 'Słowacja',
        },
    },
    slovenia:
    {
        'countryNo': 91,
        'name': 
        {
            de: 'Slowenien',
            en: 'Slovenia',
            pl: 'Słowenia',
        },
    },
    spain:
    {
        'countryNo': 11,
        'name': 
        {
            de: 'Spanien',
            en: 'Spain',
            pl: 'Hiszpania',
        },
    },
    sweden:
    {
        'countryNo': 30,
        'name': 
        {
            de: 'Schweden',
            en: 'Sweden',
            pl: 'Szwecja',
        },
    },
    switzerland:
    {
        'countryNo': 39,
        'name': 
        {
            de: 'Schweiz',
            en: 'Switzerland',
            pl: 'Szwajcaria',
        },
    },
    tunisia:
    {
        'countryNo': 212,
        'name': 
        {
            de: 'Tunesien',
            en: 'Tunisia',
            pl: 'Tunezja',
        },
    },
    turkey:
    {
        'countryNo': 52,
        'name': 
        {
            de: 'Türkei',
            en: 'Turkey',
            pl: 'Turcja',
        },
    },
}
export default Country;

现在我想遍历另一个组件中的所有条目：

...
import Country from './Country.js';
...
    <div className="dropdown-menu" aria-labelledby="navbarDropdownCountry">
        {
            Object.Keys(Country).map((country) => {
                return (
                    <a className="dropdown-item imageLink animated" href="#locations" onClick={(e) => this.handleClickCountry(e, country.name[en].toLowerCase())}>{country.name[this.props.currentLanguage].toUpperCase()}</a>
                );
            })
        }
    </div>
...

这给了我以下错误：

TypeError：Object.Keys 不是函数

首先，我尝试以这种方式进行迭代，但它也不起作用：

Country.map((country) => {
...

那么怎么做才对呢？

标签： javascriptreactjs

javascript - 遍历 React 中的对象

问题描述

解决方案

推荐阅读