React 动态引入模块方法

目的： 减少页面加载压力，对所需模块在使用时进行动态加载

例子：

动态引入excel导出插件，导出excel 文件：

   1> 函数组件内声明动态引入函数：

    const component = require('./component')  等同于 import component from './component'

   这里需要注意的是:
   用import引入的组件只需要export default即可
   而通过require引入的组件需要底部生命module.exports = component

 

    getExport(){
        // 动态引入下载模块
        let exportExcel = require(`xlsx-oc`)
        return exportExcel
    }

 

    2> 点击下载按钮，通过调用获取函数进行加载，通过es6语法解析出模块所需方法

    private download = () => {

       const { fileName } = this.state;
       const { i18n } = this.props.dep;

 

        // 获取所需模块

        const { exportExcel } = this.getExport();

 

        // excel导出组