React实现路由懒加载( 移动端 )react-loadable

React实现路由懒加载

https://www.runoob.com/w3cnote/free-html5-css3-loaders-preloaders.html

花蝴蝶在我身边围绕围绕，码代码我惟妙惟肖，还没抓到那诀窍，把握现在

安装:yarn add react-loadable

Loadadle是个函数函数中传了个对象对象中有两个参数
1.需要渲染的组件用import异步的方式
2.loading当组件加载不了时运行loading

开始使用：

用之前到上方官网找到自己想要的懒加载的样式

然后在common文件夹下创建一个新文件夹起名为Loading

注意：Loading文件中的class名要与你刚才在官网上找到的样式的class名相符,样式粘贴复制就可以了然后引到组件中使用就行了

import React from 'react';
import "./style";//引入路由样式
export default class Loading extends React.Component{
        render(){
              return <div className="路由样式中的名字"></div>
        }      
}

找到index.js入口文件(引入所有组件的组件)( 使用异步把以前的组件覆盖掉 )

原文地址：https://www.cnblogs.com/home-/p/11811787.html