Можно ли использовать React.render () несколько раз в DOM?

Я хочу использовать React для добавления компонентов несколько раз по всему DOM. эта скрипка показывает, что я хочу сделать, и это не вызывает никаких ошибок. Вот код:

HTML:

<div id="container">
    <!-- This element's contents will be replaced with the first component. -->
</div>

<div id="second-container">
    <!-- This element's contents will be replaced with the second component. -->
</div>

JS:

var Hello = React.createClass({
    render: function() {
        return <div>Hello {this.props.name}</div>;
    }
});

React.render(<Hello name="World" />, document.getElementById('container'));

React.render(<Hello name="Second World" />, document.getElementById('second-container'));

Я видел этот вопрос, и я боюсь, что, делая выше, я буду рисковать тем, что реагирующие компоненты будут мешать друг другу. Ответ на этот вопрос предполагает использование рендеринга на стороне сервера, который не является вариантом для я, как я использую Django на стороне сервера.

С другой стороны, может быть, то, что я делаю, нормально, потому что у меня есть только один экземпляр библиотеки React (в отличие от нескольких компонентов, вызывающих свой собственный экземпляр React)?

является ли этот способ использования нескольких экземпляров DOM приемлемым способом использования React?

1 75
reactjs

1 ответ:

Да, это совершенно нормально, чтобы позвонить React.render несколько раз на одной странице. Как вы и предлагали, сама библиотека React загружается только один раз, но каждый вызов React.render создаст новый экземпляр компонента, независимый от других. (На самом деле, такая ситуация не редкость на сайтах, которые находятся в процессе перехода реагировать, где некоторые части страницы генерируются с помощью React.render а другие нет.)

78