Question

我正在尝试将react组件添加到php / js项目中。添加了新文件夹，创建了新的react应用并更新了组件。该组件可以通过npm start正常工作，但是我需要将现有的JS文件连接到该组件，这是我不确定如何处理的东西？必须建立组件？如果是这样，应该如何将其添加到主JS文件中。

FYI，试图在脚本中定义react和babel，但是问题无法使用import，所以我不得不将所有内容添加到文件中，听起来不太干净。

如果您有任何想法，将不胜感激

这是main.js

<div id=root></div>
<script src="../js/missions/src/App.js"></script>

这是react组件：

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  render() {
    return (
      <h1>Test</h1>
    );
  }
}

export default App;
ReactDOM.render(<App />, document.getElementById('root'))

Answer 1

您的工作方式是创建单页应用程序的常规方法。如果您想使React应用程序与您现有的php /任何其他MVC框架一起使用，您将需要研究React的服务器端渲染技术。

这里是一个博客，可帮助您了解它如何与Node.js配合使用：https://medium.freecodecamp.org/demystifying-reacts-server-side-render-de335d408fe4

我找到了一个可以帮助您进行PHP项目的存储库： https://github.com/Limenius/ReactRenderer

这是来自官方网站https://reactjs.org/docs/react-dom-server.html

的ReactDOMServer的文档

如果在服务器端渲染组件，您仍然应该能够访问一些现有的js函数，例如事件侦听器，DOM操作等。

将React组件添加到JS项目

1 个答案: