@ArturPetrov

Как бы выглядел этот код с классовыми компонентами вместо функциональных и без хуков(hooks)?

Здраствуйте! Изучал построение React приложений только с классовыми компонентами, и не использовал функциональные компоненты, и хуки не очень хорошо понимаю, знаю только что они заменяют как-то state.
Поэтому не знаю как переделать этот код в тот который мне нужно...Прошу у вас помощи.
Вот код в песочнице:
https://codesandbox.io/s/twilight-sky-y74zx
  • Вопрос задан
  • 99 просмотров
Решения вопроса 1
@i1yas
class FeedPost extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showComments: false
    }
  }
  handler = () => {
    this.setState({
      showComments: !this.state.showComments
    })
  };
  render = () => {
    const {post} = this.props;
    return <li>
      <div>{post.title}</div>
      <div
        onClick={this.handler}
        style={{
          cursor: "pointer",
          color: "blue",
          textDecoration: "underline",
          userSelect: "none"
        }}
      >
        {this.state.showComments ? "Hide comments" : "Show comments"}
      </div>
      {this.state.showComments && (
        <ul>
          {post.comments.map((comment, i) => (
            <li key={i}>{comment.text}</li>
          ))}
        </ul>
      )}
      <Link to={`/post/${post.id}`}>Open</Link>
    </li>
  }
}


Остальные компоненты не нужно трогать.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы