Как преобразовать код String в код React, который включает функции и компоненты - PullRequest
Новая
       22

Как преобразовать код String в код React, который включает функции и компоненты

0 голосов
/ 29 октября 2019

Я пытаюсь преобразовать строку в код React. Люди, кажется, спрашивали о том, чтобы делать это со строго компонентами, и, кажется, есть отличные решения, такие как опасно SetInnerHTML, но я должен быть в состоянии сделать это с помощью функций, а также операторов импорта. Вот код с сайта React https://reactjs.org/docs/hooks-intro.html, который дает хороший пример того, как выглядит моя строка: 

var exampleString = 
"import React, useState from 'react'
function App() {
  const [count1, setCount1] = useState(0);
  return (
   <div>
     <p>You clicked {count} times</p>
     <button onClick={() => setCount(count + 1)}>
       Click me
     </button>
   </div>
  );
}"

Я получил представление от рендеринга компонента React из строки и создал нечто, похожее на это 

  const babelCode = babel.transform(exampleString, { presets: ['react', 'es2015'] }).code;
  const ToRender = new Function("React", `return ${code}`);
  ReactDOM.render(<ToRender />, document.getElementById('root'))

, что на самом деле довольно близко. Проблема здесь в том, что она не позволяет мне импортировать какие-либо библиотеки, например React, в строку, которая превращается в код. Из-за этого он выбрасывает кучу ошибок. У кого-нибудь есть идеи, как мне это сделать?

...