reactnative怎么读取本地txt文件，并将txt文件中的文本显示到画面上

在 React Native 中，可以使用 `react-native-fs` 模块来读取本地文件。下面是一个简单的示例代码：

import React, { useEffect, useState } from 'react';
import { View, Text } from 'react-native';
import RNFS from 'react-native-fs';

const App = () => {
  const [text, setText] = useState('');

  useEffect(() => {
    const filePath = RNFS.DocumentDirectoryPath + '/example.txt';
    RNFS.readFile(filePath, 'utf8')
      .then(data => setText(data))
      .catch(error => console.log(error));
  }, []);

  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>{text}</Text>
    </View>
  );
};

export default App;

在上面的代码中，我们使用 `useEffect` 钩子来在组件加载完成后读取本地的 `example.txt` 文件。我们首先定义了一个 `text` 状态来保存文本内容。在 `useEffect` 中，我们使用 `RNFS.DocumentDirectoryPath` 获取应用的文档目录路径，并拼接上文件名，得到文件的完整路径。然后我们调用 `RNFS.readFile` 方法并传入文件路径和编码方式，以读取文件内容。读取成功后，我们将文本内容更新到 `text` 状态中，并在页面上渲染出来。

需要注意的是，读取本地文件需要在应用的 `android/app/src/main/AndroidManifest.xml` 文件中添加文件读取权限：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.example">

  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

  <application>
    <!-- ... -->
  </application>
</manifest>

同时在 iOS 平台上，需要在 Xcode 中手动添加文件读取权限。