Блог

Главная - Вопросы по программированию - Реквизит не передается в дочернем компоненте в react

Реквизит не передается в дочернем компоненте в react

#javascript #reactjs

#javascript #reactjs

Вопрос:

Я изучаю react. Я пытаюсь передать props компоненту. Однако, похоже, что дочерний элемент неправильно получает реквизиты.

Мой класс приложения похож,

 import React from 'react'
import ImageList from './ImageList'


class App extends React.Component{
    state = { images: [] }

    render = () => {
        return(
            <div className="ui container">
                <ImageList images={this.state.images}/>
            </div>
        )
    }
}

export default App

И мой класс ImageList выглядит так

 import React from 'react'

class ImageList extends React.Component{
    render = (props) => {
        console.log(props)
        return(
            <div>
                test
            </div>
        )
    }
}

export default ImageList

Как вы можете видеть, я передаю <ImageList images={this.state.images}/> из приложения. Это должно передать состояние изображений, которое сейчас является пустым массивом. Однако console.log(props) отображается undefined список изображений, но я ожидаю увидеть где-то там пустой массив (props.images).

Ответ №1:

В компоненте класса render не принимает аргумент props. Вместо этого вы ссылаетесь this.props на него.

Комментарии:

1. Спасибо. Это сработало. Я приму ответ. Один маленький запрос. Тогда мне больше не нужен render = (props) => . часть (props) не нужна. Верно?

2. Часть (props) не нужна, да.

Ответ №2:

В компоненте класса render не принимает аргумент props. Вы можете попытаться получить доступ к реквизитам, подобным этому, в компоненте класса.

 import React from 'react'

class ImageList extends React.Component{
    render () {
        console.log(this.props)
        return(
            <div>
                test
            </div>
        )
    }
}

export default ImageList