用React.lazy预加载

时间:2019-09-10 10:14:59

标签: reactjs code-splitting react-loadable

react-loadable公开了一个非常不错的方法YourLoadableComponent.preload(),您可以根据需要轻松地预加载组件,然后再进行呈现(onMouseOver等)。

我可以看到我可以执行以下操作:https://github.com/pomber/react-lazy-preload-demo/pull/8/commits/126c1bf6e2a23b3e3f7eb0ffb1b4db260516643f 因此要手动调用import(),将结果Promise存储在某个变量中,然后将其传递给React.lazy()。但是,如果我想在某个类方法调用或生命周期挂钩中预加载,则可能会过于冗长和成问题。

上述方法还有其他选择吗?

1 个答案:

答案 0 :(得分:1)

您可以尝试https://github.com/ianschmitz/react-lazy-with-preload。似乎很好地适合了您的用例!