Вкладки в реакции не отображают соответствующий контент - PullRequest
0 голосов
/ 08 мая 2018

Я использую Tab от semantic-ui-реакции. Мне нужно отобразить список дней и соответствующих событий для этого дня. Тем не менее, событие, созданное в один день, появляется и в другой день.

enter image description here

enter image description here

Как видно, я создал событие в 1-й день, но оно появляется на 2-й день, что неверно. Вот как я генерирую данные вкладки:

const panes = selectedDays.map((day, index) => {
  const count = index + 1;
  return {
    menuItem: `Day ${count}`,
    render: () => <Tab.Pane><Agenda day={day} index={count} /></Tab.Pane>
  };
});
this.setState({ panes });

Код компонента

{
            currentIndex === 3 &&
            <Fragment>
              <Tab
                menu={{ pointing: true }}
                panes={this.state.panes}
              />
              <Button className='formnext' onClick={this.handlePrevious}>
                <FontAwesome name='angle-left' style={{ color: 'white', fontSize: '2.2rem' }} className='logout' />
              </Button>
              <Button className='formnext' onClick={this.handleNext}>
                <FontAwesome name='angle-right' style={{ color: 'white', fontSize: '2.2rem' }} className='logout' />
              </Button>
            </Fragment>
          }

Если я добавлю атрибут key к компоненту Tab.Pane или Agenda, щелкнув заголовок вкладки, просто очистится мое состояние, и у меня не останется никаких данных. Есть идеи, как решить эту проблему?

...