React Native 动态要求(图像)



我正在编写一个类似于 coinmarketcap.com 的应用程序。 一个包含多达 700 个硬币和图标等的巨型列表。但是在我的应用程序中,您可以选择要跟踪的硬币。

有没有办法不需要所有 700 个图标,而只需要选定的图标? 现在我有一个对象.js文件,其中包含:

export const IMAGES = {
'btc-usd': require('../icons/bitcoin.png'), //statically analyzed
'eth-usd': require('../icons/ether.png'),
...

但我担心内存和性能。React 会将它们全部加载到 RAM 中吗?或者只是当它渲染时? 非常感谢您的帮助

找到了这个解决方案,但不确定它在技术上是否更有效:

我发现一个简单的解决方案是创建一个非常简约的解决方案 package.json 在您要绝对导入的最顶层文件夹中 从。该 package.json 应如下所示: { "name": "src" }, 其中"src"是该文件夹的名称。

您可以简单地从"src/X.js"导入X,就像您将一样 通常会。

非常感谢您的帮助!

你试过使用平面列表吗?它只会呈现视图中的项目以及前面的几个项目。它应该为您提供所需的性能提升。至于懒惰地要求/加载图像,也许使用像 react-native-lazyload 这样的包。

最新更新