本篇文章主要介紹了詳解React開發中使用require.ensure()按需載入ES6元件，非常具有實用價值，需要的朋友可以參考下
首先介紹下動態載入函數：
require.ensure([], (require)=>{
let A = require('./a.js').default;
})如果想要動態載入出es6程式碼元件，直接require一個es6風格的元件是不行的，因為一般的語言編譯工具（如babel）,不支援直接require一個es6風格的元件。
那麼有種辦法可以解決：在es6方式書寫的元件底部增加一句：module.exports = YouclassName;
import React, {Component} from 'react';
export default class Father extends Component {
constructor (props)=>{
super();
this.state = {
currentComponent:null
}
}
doSomething = () => {
require.ensure(['./app2'], (require) => {
const Comp = require('./app2');
this.setState({
currentComponent:<Comp />
})
})
}
render () {
return (
<p>
<span onClick={this.doSomething} >
点击后，按需加载模块~
</span>
{this.state.currentComponent}
</p>
)
}
}app2
import React,{Component} from 'react';
export default class Hello extends Component {
render () {
return (
<p>你好，祝你幸福，再见~</p>
)
}
}
module.exports= Hello；因為在require .ensure()中使用了require()引入模組，所以組件後面必須用module.exports導出元件；
【相關推薦】
1. 特別推薦：「php程式設計師工具箱」V0.1版本下載
2 . 免費js線上影片教學
3. php.cn獨孤九賤（3）－JavaScript影片教學
以上是動態載入ES6程式碼組件的方法教程的詳細內容。更多資訊請關注PHP中文網其他相關文章！
