1

export const GetInputValue = (props) => {

    const value = props.value;
    return (
        null
    );
};

export function Items(props) {

    const temp = [];

    const howMuchTimes = (times) => {
        for (let i = 0; i < times; i++) {
            temp.push(i)
        };
    };


    howMuchTimes(!!Здесь должно быть значение переменной value!!);

    return (
        <div className="items-list">
            {temp.map((e) => <Item key={Math.random() * 9999} itemStyle={{
                background: '#fff',
                width: '140px',
                height: `${Math.floor(Math.random() * (850 - 10) + 10)}px`,
                 margin: '0 .2rem'
            }} />)}
        </div>
    )
}

GetInputValue через рендер-пропсы получает состояние из другого компонента, const value - в этой переменной записано то состояние, и вопрос как передать его в компонент Items?

1 ответ 1

1

Есть несколько вариантов:

1)Подъём состояния

Часто несколько компонентов должны отражать одни и те же изменяющиеся данные. Мы рекомендуем поднимать общее состояние до ближайшего общего предка.

2) Контекст

Контекст позволяет передавать данные через дерево компонентов без необходимости передавать пропсы на промежуточных уровнях.

3) Компоненты высшего порядка

Компонент высшего порядка (Higher-Order Component, HOC) — это один из продвинутых способов для повторного использования логики. HOC не являются частью API React, но часто применяются из-за композиционной природы компонентов.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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