Почему не работает код React?

Question

[mosikus]

Обозначу проблему сразу - я тупой. В html этот https://codepen.io/anon/pen/QeaWmp код работает прекрасно. В React ничего не происходит. Помогите, пожалуйста, как это сделать в реакте ?

Comments

[0xD34F]

В React ничего не происходит.

Почему код не показали?

Answer 1

[Mikhail Osher]

Набросал на коленке: https://codesandbox.io/embed/blissful-buck-csbz8

Comments

[mosikus]

Спасибо.

[mosikus]

Mikhail Osher
Mikhail, а как записать value в this.state ? Я всячески пытался колдовать, но ловлю ошибку, я не понимаю как это сделать

Answer 2

[0xD34F]

function App() {
  const [ text, setText ] = React.useState('');

  const append = e => setText(text + e.target.textContent);
  const clear = () => setText('');

  return (<>
    <div className="row">
      <textarea value={text} readOnly />
    </div>
    <div className="row">
      {Array.from({ length: 10 }, (_, i) => (
        <button onClick={append}>{i}</button>
      ))}
    </div>
    <div className="row">
      <button onClick={clear}>clear</button>
    </div>
  </>);
}

.row {
  display: flex;
  justify-content: center;
  padding: 5px;
  gap: 5px;
}

Comments

[Mikhail Osher]

клёво с textContext, что-то я вообще не думал об этом)

[Петр Мухуров]

Mikhail Osher, что такое textContext?

[Mikhail Osher]

Петр Мухуров, https://developer.mozilla.org/en-US/docs/Web/API/N...