如何加載頁面包含ReactJs到其他頁面使用jquery ajax

我正在一個現有的應用程序。我在React Js中寫了一些觀點。現在我想使用jquery load在其他頁面加載這些視圖。那可能嗎。如何加載頁面包含ReactJs到其他頁面使用jquery ajax

[假設leave.html包含反應代碼。現在我想使用jquery load在index.html中加載leave.html。 index.html沒有反應代碼。如何做到這一點]

2017-03-06 Nikhil Vijay

我不確定你是否實際上可以使用加載反應components.But爲什麼你想要使用jquery加載，而不是你可以使用在您的index.html中創建一個元素div與id = "leave"並追加你的反應組件讓的WebPack編譯器採取解析它的index.html，從leave.html代碼可以去爲如在JSX文件反應成分如護理：

import React from 'react'; 
    class Leave extends React.Component { 
    constructor(props){ 
    super(props);//if you have properties 
    this.state = {}; 
    this.myFunc= this.myFunc.bind(this); // bind your methods like this. 
    } 
    myFunc(){ 

} 
render(){ 
    return (
     <div> 
      <!-- Html content to be added over here. --> 
      {this.myFunc()} 
     </div> 
    ); 
} 
} 
export default Leave;

用於創建app.js您應用程序並將以上導出的模塊添加到index.html中

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import Leave from './jsx/Leave.jsx'; //import your module from jsx path. 
ReactDOM.render(<Leave/>, document.getElementById('leave')); //append the compile data to index.html.

index.html的將是這樣的：

<html> 
    <body> 
    <div id="app"></div> 
    <script src = "/build/index.js"></script> 
    <!--index.js is build by webpack--> 
    </body> 
</html>

使用的WebPack編譯反應，你就可以擁有可重用的組件在應用程序中。

謝謝

來源

2017-03-06 05:55:04

如何加載頁面包含ReactJs到其他頁面使用jquery ajax

回答

相關問題