React JS отображение / отображение элементов

Question

, поэтому я пытаюсь передать массив игрока в качестве реквизита компоненту приложения, а затем использовать сопоставление для итерации по initialPlayers и возврата компонента игрока для каждого объекта в массиве. Пожалуйста, проверьте изображение ниже.

Это страница приложения. js. ReactDOM.render находится в индексе. js.

Я получаю эту ошибку:

TypeError: не удается прочитать свойство initialPlayers из undefined

Любой хороший и быстрый совет, пожалуйста?

Спасибо

class App extends Component {
constructor(props) {
    super(props);
    this.state = {};
}

render() {

    const players = [

        { name: "Dex",
            score: 33
        },
        {
            name: "Rocko",
            score: 61
        },
        {
            name: "Lance",
            score: 29
        },
        {
            name: "Zane",
            score: 42
        },

    ];


ReactDOM.render(
  <React.StrictMode>
    <App players />,
  </React.StrictMode>,
  document.getElementById('root')
);

Answer 1

Привет,

вы передаете в качестве реквизита имя players и почему вы пытаетесь вызвать initialPlayers?

попробуйте это:

props.players.map

Answer 2

Попробуйте изменить следующим образом:

ReactDOM.render(
  <React.StrictMode>
    <App players={players} />,
  </React.StrictMode>,
  document.getElementById('root')
);

Как вы написали код, игроки будут оцениваться как атрибут вместо свойства.

Более того , Я предлагаю вам проверить свой prop.initialPlayers перед повторением карты, потому что он может быть undefined (в вашем случае у вас есть эта ошибка из-за именования -> это должно быть player вместо initialPlayer или наоборот), например, вы можете написать что-то вроде:

{(props.players || []).map(etc.)}