1

Есть parent компонент. В нем есть массив данных (в моем случае это картинки). С помощью map я перебираю этот массив и создаю child компонент. Выглядит примерно так:

this.state.uploadedFiles.map((el, i) => {
    return (
        <Item key={el.id} id={el.id} item={el} />
    )
})

также у parent компонента есть кнопка по нажатии на которую я хочу получить данные каждого child Item (к примеру: имя файла) и добавить в массив? который находится в parent компоненте.

Вопрос, как это сделать? Буду очень признателен за ответы. Спасибо!

1 ответ 1

0
class Parent extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            uploadedFiles: [{label: 'file1'}, {label: 'file2'}],
            selectedFiles: []
        }
    }

    selectFile = ({target: {name}}) => this.setState(({selectedFiles}) => ({
        selectedFiles: [...selectedFiles, name]
    }));

    File = ({label, callback}) => {
        return (<div>
            {label} <button name={label} onClick={callback}>Select</button>
        </div>)
    };

    render() {
        const {uploadedFiles, selectedFiles} = this.state;
        console.log("selected", selectedFiles);
        const Component = this.File;
        return (<React.Fragment>
            {uploadedFiles.map((file, i) => <Component key={i} label={file.label} callback={this.selectFile} /> )}
        </React.Fragment>)
    }
}

export default Parent;

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.