注册账号登录
小k
...
关注

react 服务器渲染的首页渲染后客户端的js中loadable触发,重新加载的的问题解决

在客户端渲染前,也就是render前:

先把首屏需要的js加载完成

利用react-router-dom中的matchPath匹配到当前的路由

//引入react-router-dom
import { matchPath } from 'react-router-dom';

在将loadable过的组件预加载就可以了

//预加载首屏组件的js
const PreLoadRoute = async () => {
	let currentRoute = null,
		match = null;
	routers.some(route => {
		let _match = matchPath(window.location.pathname, route);
		if (_match) {
			currentRoute = route;
			match = _match;
		}
		return _match;
	});
	await currentRoute.component.preload();
}