Как добавлять и удалять класс, когда нажимаю на элемент?

Question

[And1991]

Как добавлять и удалять класс, когда нажимаю на элемент?

<a href="/" onClick={this.showAllBook.bind(this)}>All Book</a>

и на нем висит обработчик

showAllBook(event) {
    event.preventDefault();
    const name = "One";
    this.props.showAllBooks();

который наследует props от родительского компонента

showAllBooks() {
    const { allBooks } = this.state;
    this.setState({filteredBooks: allBooks});
}

как я могу добавлять класс к нажимаемой ссылке и удалять, когда нажимается другая?

Answer 1

[Антон Спирин]

<a 
  className={filter === 'all' ? 'active' : null}
  onClick={() => setFilter('all')}
>
  All Book
</a>