如何避免react-router4按需加载时踩坑填坑，实现高效长尾词路由？

本文共计740个文字，预计阅读时间需要3分钟。

React Router 4 中实现按需加载 Component 的方法：

在 React Router 4 中，`getComponent` 方法已被移除，因此不能再使用它来实现按需加载。以下是一些替代方案：

1. 动态导入（Dynamic Imports）： 使用 ES6 的动态 `import()` 语法来按需加载组件。

javascript const MyComponent=lazy(()=> import('./MyComponent'));

2. React.lazy： 使用 `React.lazy` 和 `Suspense` 来实现组件的懒加载。

javascript import React, { Suspense, lazy } from 'react';

const MyComponent=lazy(()=> import('./MyComponent'));

function MyRoute() { return ( ); }

3. React Loadable： 使用 `react-loadable` 库来实现组件的懒加载。