Использование значений объекта, переданных в качестве реквизита от родительского компонента

Я пытаюсь использовать значения, переданные от моего родителя, в моем дочернем компоненте. Я передаю объект, я использовал для этого оператор распространения

//Parent Component

 <Pagination {...pagination} />

Мне интересно, как я могу получить доступ к значениям объекта? До сих пор я обнаружил, что могу console.log с помощью

//Child component

this.props.children.props.children.props.current

и получить правильное значение, но когда я пытаюсь сохранить это значение в константе и использовать его, он возвращает мне undefined? Я почти уверен, что именно так я пытаюсь получить значение реквизита, но я понятия не имею, как ... Заранее спасибо!


reactjs object react-props
person Alexandre Savard-Plante    schedule 01.05.2019    source источник
comment
в компоненте Pagination просто console.log(this.props) вы поняли идею   -  person Nane    schedule 01.05.2019

Ответы (2)


arrow_upward
0
arrow_downward

Все свойства, переданные компоненту, доступны через this.props. [PropName].

Если вы деструктурируете объект до свойств компонентов, тогда все свойства объекта добавляются непосредственно в свойства компонентов. Пример:

const x = { a: 1, b:2 };
<Component {...x} />

К значениям «x» теперь можно получить доступ в «Компонент» через

this.props.a / this.props.b
person Berouminum    schedule 01.05.2019
comment
Сейчас мой объект - это разбиение на страницы, и он возвращает current: 1 limit: 24 offset: 0 total: 365. Я пытался зарегистрировать this.props.current, но он по-прежнему возвращает undefined? - person Alexandre Savard-Plante; 01.05.2019
comment
@ AlexandreSavard-Plante Вы регистрировали разбиение на страницы в рендере перед тем, как передать его как опору, и удостоверились, что значения не являются неопределенными в это время? Если значения существуют, но проблема все еще возникает, отредактируйте свое сообщение и добавьте дополнительный код для проверки. - person Berouminum; 01.05.2019

arrow_upward
0
arrow_downward

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

// Родительский компонент

 <Pagination pages = {...pagination} />

// Дочерний компонент

this.props.pages
person Narendra Chouhan    schedule 01.05.2019