在 React native 中从本地 json 文件导入文本

Question

我想知道如何将大文本导入视图的常见方法。在我的例子中，我正在为 Android 和 iOS 开发一个 React Native 应用程序，并且我想在我的一个视图中展示 "Terms of Use" 文档。现在，当我只是 import/copy 将它粘贴到一个文本组件中时，它就不是正确的解决方案，尤其是当我需要使用本地化来呈现所需的语言时。我如何 "import" 这个文本块，以便它的格式很好，我不需要将所有内容都放入我的视图中：

 <View style={styles.container}>
      <Text style={styles.text}> |JSON - Text-file, with about 600 words -> Terms of Use document |</Text>
 </View>

Answer 1

我认为它是 JSON，尤其是当您需要将一些其他（元）数据与文本一起使用时。在 componentWillMount 上调用 fetch(url) 并填充 <Text>{this.state.hugeText}</Text> 组件：

作为一个概念：

constructor(props) {
  super(props);
  this.state = {
    hugeText: ''
  };
}

componentWillMount() {
  fetch('myText.json')
  .then((res) => res.json())
  .then((data) => {
    this.setState({
      hugeText: data.something
    });
  });
}

Answer 2

我尝试了 fetch 但没有成功（无法找到该文件）。

我试过这个，它奏效了：

// at top of file
var jsonData = require('./myfile.json');


// inside component definition
render() {
    let deepProp = jsonData.whatever;
}

Answer 3

您可以使用：

import file from './config/TermsAndCondition.json';

那么你可以把它当作一个javascript对象：

file.description

在 React native 中从本地 json 文件导入文本

Importing Text from local json file in React native

react-native