Как анимировать удаление абзаца буква за буквой в React

Question

Я хочу анимировать удаление части абзаца HTML буква за буквой, как будто удерживая клавишу удаления.Может быть важно сказать, что текст занимает несколько строк.

<p className="paragraph1">
  <span className="keep">Text that should not be deleted.</span>
  <span className="hide">Text that should be deleted.</span>
  <span className="keep">More text that should not be deleted.</span>
</p>

<p className="paragraph2">
  <span className="keep">Text that should not be deleted.</span>
  <span className="keep">More text that should not be deleted.</span>
  <span className="hide">Text that should be deleted.</span>
</p>

Answer 1

Если вы используете React, вам не нужно обращаться к DOM, чтобы показать или изменить текст.

const words = ["CSS3.", "HTML5.", "javascript."];

Строки должны исходить из реквизита для более функционального подхода или храниться в состоянии компонента,Затем вы можете просто использовать тайм-аут для изменения состояния.

И, конечно, отображать состояние внутри абзацев.