КАК ВНЕДРИТЬ ДИНАМИЧЕСКИЙ ВВОД В DOM

При создании веб-приложения в реакции с использованием JSX мы обнаруживаем, что, поскольку мы пытаемся разработать веб-приложение, а не веб-сайт, мы стараемся максимально отказаться от использования статического ввода данных и вместо этого использовать динамический ввод данных, это связано с тем, что пользователь обычно отвечает за ввод данных.
Таким образом, при попытке отобразить динамический ввод данных в Dom с помощью JSX мы можем использовать следующий синтаксис;
Создайте объект, который будет содержать пример ввода динамических данных:

const example = {
example1: ‘the following string’,
example2:   20   (‘the following number’),
example3: [‘the following array’]
}

Теперь, когда мы создали динамический объект ввода, нам просто нужно подключить его к полям ввода там, где мы хотим.

const htmlPlacement =
 (
  <h1>{example.example1}</h1>
  <p>{example.example2}</p>
  <p>{example.example3}</p>
);

Теперь мы связали динамические данные с полем ввода данных с помощью «{}», теперь эти фигурные скобки позволяют нам вводить синтаксис js в наш jsx.
и осталось отрендерить его в дом следующим образом.
NB: Убедитесь, что есть корневое приложение, которое помещается в идентификатор HTML.