@SideWest
Python.Новичок

Как отрендерить компонент из другого?

Есть массив

const dialogs = [
    { name: 'Vlas', id: 1253533, messages: [ 'привет', 'и тебе привет', 'как дела?', 'нормально, а твои?' ] },
    { name: 'Oleg', id: 1432344, messages: [ 'привет', 'и тебе привет', 'как дела?', 'нормально, а твои?' ] },
    { name: 'Dima', id: 1274563, messages: [ 'привет', 'и тебе привет', 'как дела?', 'нормально, а твои?' ] }
]

let AcDialog = 0
// потом выбираю диалог dialogs[ AcDialog ]


Есть структура

function Container () {
    return (
        <div className='container'>
            <Infoheader />
            <Messages />
            <MessageInput />
            <NextButton />
        </div>
    )
}


По нажатию на
NextButton
должен меняться индекс массива и заного рендериться всё остальное уже с другим именем, id и сообщениями

Вот сам компонент кнопки
const NextButton = () => {
    return <button onClick={() => {
        AcDialog += 1
        console.log( AcDialog );
    }} className='nextButton' > Next</button >
}


Я перепробовал много вариантов, но так и не смог реализовать ререндер всех компонентов по нажатию на кнопку,

Я использую хуки и каждый компонент у меня это отдельная стрелочная функция, не хочу пихать всё в один класс

Пожалуйста, подскажите как это всё правильно и лучше реализовать
  • Вопрос задан
  • 96 просмотров
Решения вопроса 1
Robur
@Robur
Знаю больше чем это необходимо
любые данные от которых зависит рендер надо класть в стейт и менять через соответствующие функции.
Если вы используете хуки, то
const [AcDialog, setAcDialog] = useState(0)

менять через setAcDialog.

Дальнейшие детали зависят от того как именно вы организовали остальное
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Leningrad Media Санкт-Петербург
от 80 000 до 140 000 ₽
SaveTime Москва
от 160 000 до 230 000 ₽