Как загрузить компонент React в HTML-код, представленный через Ajax - PullRequest
0 голосов
/ 10 октября 2019

У меня есть устаревшее веб-приложение с файлом представления, который отображает его содержимое с помощью нескольких вызовов ajax. В последнем html, который будет отображаться через ajax, я пытаюсь добавить компонент реагирования к нему, следуя этому уроку https://reactjs.org/docs/add-react-to-a-website.html,, но ничего не отображается, только обычный html.

Мой html для этогопоследний раздел выглядит так:

<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

<div id="react-container"></div>

<script type="text/babel" src="myReactComponent.js">

<div class="table-responsive">
    ...The rest of the html

И мой компонент выглядит так:

class MyReactComponent extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
            <div>
                <div className='my-class'>
                    <p>Some text</p>
                    <input type="text"/>
                </div>
            </div>
        );
    }
}

ReactDOM.render(<MyReactComponent />, document.getElementById('react-container'));

И, наконец, вызов ajax:

$.ajax({
  url: '/controller/action',
  dataType: 'html',
  success: function(html) {
    $('#my-panel .panel-body').html(html);
  }
});

Есть ли некоторыеКак обойти эту работу?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...