Почему не работают табы в React?

Question

[Сергей]

Не выходит запустить работу табов в React( Ни сами табы не переключаются, ни активный класс на кнопках не срабатывает. Подскажите, пожалуйста, в чем ошибка?
https://stackblitz.com/edit/react-yitwhz

Answer 1

[Corvuss]

Переписать вот так:

setSelected = (tab) => {
      this.setState({
        activeTab: tab,
      });
    }

Или вот так (передать контекст):

<Cardlist apartmentTabs={apartmentTabs} setSelected={this.setSelected.bind(this)} />

Первый вариант предпочтительней, ибо второй несколько устаревший уже.

Плюс ошибка в className в дивов (this.state.activeTab), неправильно указаны номера.

Также в компоненте CardList, лучше так:

handleClick={() => this.props.setSelected(card.order)}

В общем вот исправленный вариант https://stackblitz.com/edit/react-x3p8yb?file=src%...

Comments

[Сергей]

Огонь! Спасибо!) ... проблема контекста значит