jQuery ajax를 사용하여 ReactJs를 다른 페이지에 포함하는 페이지를로드하는 방법

기존 응용 프로그램에서 작업 중입니다. 나는 React Js에서 몇몇 견해를 썼다. 이제 jQuery로드를 사용하여 다른 페이지에서 이러한 뷰를로드하고 싶습니다. 그게 가능하니?jQuery ajax를 사용하여 ReactJs를 다른 페이지에 포함하는 페이지를로드하는 방법

[leave.html에 반응 코드가 있다고 가정합니다. 이제 jquery load를 사용하여 index.html 내에 leave.html을로드하려고합니다. index.html에는 반응 코드가 없습니다. How do to do}

출처

2017-03-06 Nikhil Vijay

실제로 반응 성분을 사용하여로드를 사용할 수 있는지 확실하지 않습니다. 대신 jquery로드를 사용하는 대신 index.html에 div과 id = "leave"이라는 요소를 만들고 추가하십시오. 당신의 반응 구성 요소 웹팩 컴파일러는 같은 jsx 파일에 구성 요소를 반응 등으로 leave.html에서 코드가 갈 수 있습니다, 그것은 index.html을 구문 분석을 돌봐 보자

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에 추가하십시오.

반응 컴파일

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

사용 웹팩을 당신은 응용 프로그램에서 재사용 가능한 컴포넌트를 가질 수있을 것입니다 : 0

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은 다음과 같이됩니다.

감사합니다.

출처

2017-03-06 05:55:04

jQuery ajax를 사용하여 ReactJs를 다른 페이지에 포함하는 페이지를로드하는 방법

답변

관련 문제