react-native - React Native 如何存储和导入静态文件？

Question

我想将静态 *.txt、*.svg 甚至 *.js 文件存储在 assets 文件夹(或其他通常首选的路径)。然后我想将它们作为字符串导入到 App.js 中。关于这个话题有很多相互矛盾的信息。我如何在全新的应用程序中正确地做到这一点？

Answer 1

如果你有一个像这样的 json 文件:

const data = {
  key1: 'value1',
  key2: 'value2',
};

export default data;

访问您的数据的唯一方法是通过:

import data from '../your/relative/path/to/data';

如果你想在该文件中导入特定的 key ，那么你的 json 文件应该是这样的:

export const key1 = 'value1';
export const key2 = 'value2';

const data = {
    key1,
    key2,
};

export default data;

现在您可以这样做了:

import { key1 } from '../your/relative/path/to/data';

或

import data from '../your/relative/path/to/data';

我建议对于文本 文件，将它们存储在constants 文件夹中，并为每个类别制作一个相关的.js 文件:

constants.js 文件:

export const CONST_KEY_1 = 'some value';
export const CONST_KEY_2 = 'some other value';
export default {
    CONST_KEY_1,
    CONST_KEY_2
};

对于 svg 文件:

快速方法:将每个文件的 file_uri 存储在一个键值对中，就像我们在 constants.js 文件中所做的一样

更好的方法:以我们在 constants.js 文件中所做的相同形式存储这些 svg 文件的 svg 路径 ...并使用 react-native-svg npm 模块呈现这些文件。