Может ли веб-сайт работать с простым JavaScript и React?

Question

У меня есть дизайн сайта, который содержит JavaScript без каких-либо рамок.Сейчас я нахожусь в процессе разработки, и мне нужно использовать фреймворк javascript, например, реагировать на конкретный процесс.так будет ли работать или мне нужно все превратить в каркас?Я работаю с Laravel и как я могу создать приложение с несколькими реакциями для одного веб-сайта внутри платформы Laravel?

Answer 1

Из документов React:

React можно использовать в любом веб-приложении.Он может быть встроен в другие приложения, и с небольшой осторожностью другие приложения могут быть встроены в React.

Чтобы интегрировать React с другими библиотеками или средами, ознакомьтесь с руководством по интеграции React: https://reactjs.org/docs/integrating-with-other-libraries.html

Answer 2

Да, вы можете создавать глобальные функции визуализации окон из библиотеки реагирования и вызывать их из vanilla js или другой сторонней библиотеки, такой как jquery. Вам просто нужно включить минимизированные js для вызова этой функции.

Некоторые вещикак показано ниже на реаги

const app = (parameter1,parameter2) => (
          <YourComponent parameter1={parameter1} parameter2={parameter2}/>
);





window.renderYourComponent = function (p1, p2) {
    render(app(p1,p2), document.getElementById('your_div'));
}

на вашем vanilla js

 <script type="text/javascript" src="your_minified_react.js"></script>
 <div id='your_div'></div> 
 window.renderYourComponent("p1","p2");

Все будет отображаться внутри 'your_div', и вы можете работать отдельно с реагированием

Answer 3

Да.Это именно та проблема, которую Facebook стремился решить, создав React.Изначально они использовали React только для частей системы комментариев и своего чата.

Вы можете создать компонент React и использовать его только в части своего веб-сайта.Вам просто нужно предоставить ему место для монтажа.То есть, div, где вы монтируете свое приложение.

Обратитесь к документации для React DOM и руководству по интеграции для получения дополнительной информации о рендеринге в DOM.Основная идея состоит в том, чтобы создать свой компонент, а затем использовать следующий код для его визуализации:

ReactDOM.render(element, container[, callback])