Блог

Главная - Вопросы по программированию - Реагируйте, передавая массив от компонента к дочернему элементу useState (модальному). Нравится передавать как массив и возвращать его как массив, чтобы можно было сохранить

Реагируйте, передавая массив от компонента к дочернему элементу useState (модальному). Нравится передавать как массив и возвращать его как массив, чтобы можно было сохранить

#reactjs

Вопрос:

У меня есть следующий родительский компонент реакции. Я хотел бы либо передать meeting.settings.ae (массив объектов) для дочернего компонента useState. Не знаю, как я могу это исправить.

 import React, {Component} from 'react';
import AEModal from "./AEModal";

export default class MAT extends Component {
    constructor(props) {
        super(props);
        this.state = {
            ae: !!meeting.settings.ae ? meeting.settings.ae : ""
        };
    }

    getMeetingAEArray = () => {
        let setting = this.state.settings();
        return !!setting amp;amp; !!setting.ae ? setting.ae : null;
    }

    getMeetingAE = () => {
        return <AEModal

            meeting={() => {
                return this.state.meeting;
            }}
            
            AEArray={() => {
                return getMeetingAEArray();
            }}
        />
    }
}

Класс для детей

 import React, { useState } from "react";
import i18n from 'Components/translations/i18n';
import {
  Icon,
} from '@components';

function AEModal(props) {

  const [form, setForm] = useState([]);
  let meeting = props.meeting();
  let ae = meeting.settings.ae; //ae is undefined
  let aeArray = props.getAEArray();
}

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

1. Так откуда meeting же взялся этот предмет ?

2. И почему вам нужно передать массив от родителя к ребенку, чтобы сохранить его внутри ребенка ? Вы можете просто хранить свой массив внутри своего родителя как состояние. Чтобы изменить это состояние, создайте другой метод внутри своего родителя, а затем передайте его дочернему компоненту. Из дочернего компонента вы можете вызвать переданный метод.

3. ПРИВЕТ @KavinduVIndika, Вы правы, я новичок в реагировании. Я попробовал код обновления выше с помощью метода getMeetingAEArray для передачи, но он не работает. Не могли бы вы поправить меня, как передать этот метод дальше?

4. @KavinduVIndika Собрание начинается с родительской страницы. Итак, ЭМОдаль-третий ребенок.

5. Можете ли вы также предоставить этого родителя ? Вам не нужно сохранять состояние родительской опоры в каждом дочернем компоненте. Вы можете просто использовать его во всех компонентах.

Ответ №1:

Чтобы передать реквизиты, исходящие от родителя, вы можете сделать это следующим образом.

Ниже приведен пример. Пожалуйста, измените его для вашей реализации.

 import React, { Component } from "react";
import AEModal from "./AEModal";

export default class MAT extends Component {
  render() {
    return (
      <AEModal
        meeting={this.props.meeting}
      />
    );
  };
}

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

 import React, { useState } from "react";

function AEModal(props) {
  console.log("meeting: ", props.meeting);

  return <div>{props.meeting}</div>;
}
Метки: , ,