Могу ли я вставлять теги JSX друг в друга, используя традиционный синтаксис JS?

#javascript #reactjs

#javascript #reactjs

Вопрос:

 const JSXParentTag = <div></div>;
const JSXChildTag = <p></p>;
 

Рассмотрим parentTag amp; childTag выше. Возможно ли вставить childTag , parentTag чтобы выглядеть примерно так:

 <div>
  <p></p>
</div>
 

используя традиционный синтаксис JS? Например, что-то вроде этого:

JSXParentTag.child = JSXChildTag;


PS Я знаю, что ты умеешь писать <div>{JSXChildTag}</div> . Мне интересно, могу ли я вложить их, используя традиционный синтаксис JS, поскольку я сортирую несколько массивов тегов JSX, и это упростит задачу.

Ответ №1:

Нет, вы не можете. JSX — это синтаксическое расширение JavaScript. Babel компилирует JSX до вызовов React.createElement() . В вашем примере <div> компилируется в React.create('div') . Если вы хотите писать в «традиционном синтаксисе JS», вы можете использовать createElement метод.

 React.createElement('div', null, React.createElement('p'));