Как правильно переносить JSX - PullRequest
Новая
       1

Как правильно переносить JSX

1 голос
/ 16 мая 2019

Элементы React не отображаются в браузере, но код прекрасно работает в codepen.

Я пытаюсь добавить элементы React в существующий проект, бэкэнд которого написан на Go, а интерфейс находится в Angular.js.,Теперь я попытался использовать пошаговые инструкции на странице React, и у меня все это работало, пока я не использую JSX.Когда я начал использовать JSX с предоставленной Babel CDN, я заметил, что мой браузер понимает, что я использую код React, но элементы не отображаются.

Я также начал использовать другой код.Такая же ситуация.Браузер подтверждает код React, но ничего не отображается.Я попробовал кусок кода ниже в codepen, и он работает.

<div ng-view="" class="ng-scope"><div class="ng-scope">
    <p>Hello Moto!</p>
</div>

<br class="ng-scope">

<div id="root" class="ng-scope"></div>


<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js" class="ng-scope"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js" class="ng-scope"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.21.1/babel.min.js" class="ng-scope"></script>
<script type="text/babel" class="ng-scope">
    class Greeting extends React.Component {
        render() {
            return (<p>Hello world</p>);
        }
    }      
    ReactDOM.render(
        <Greeting ></Greeting>,
        document.getElementById('root')
    );
</script>
</div>

В codepen я вижу и "Hello Moto", и "Hello World".В моем приложении, с другой стороны, я ничего не получаю.

Должен ли я устанавливать другие вещи?или у меня есть другие проблемы, которые не очевидны?

...