0

Я новичок в React и работаю над созданием простенького Quiz-виджета, но столкнулся с проблемой: нужно добавлять в массив ответов результат, который хранится в выбранной радиокнопке. Пишу на ReactJS. Заранее благодарен за помощь. Пример кода:

https://codesandbox.io/s/inspiring-mendel-0q2fq

1
  • 1
    Зачем для каждого вопроса новый компонент создавать?
    – user355286
    13 дек 2019 в 8:16

1 ответ 1

1

Вариантов несколько, самый простой и стремный это прокидывать колбэк функцию в каждый свой компонент, например: В классе Vote в state добавить answers -

this.state = {
      isStarting: false,
      answers: [],
    };

Создать коллбэк функцию, которая будет добавлять ответ в этот массив:

addAnswer = (answer) => this.setState(prev => ({...prev, answers: [...prev.answers, answer]}));

Прокидываем эту функцию в компонент - <Question1 addAnswer={this.addAnswer}/> В компоненте Question1 дописывает функцию:

 handleRadioChange(event) {
    this.setState({ option: event.target.value });
    this.props.addAnswer(event.target.value);
  }

Соответственно, надо прокинуть во все вопросы эту функцию, а потом в компонент результатов и сам массив с ответами. Можно еще посмотреть в сторону контекста, что бы не прокидывать колбэк в каждый компонент. Еще бы лучше - не разделять каждый вопрос на разные компоненты

Ваш ответ

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

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