如何在React-native中从.json文件中动态获取本地镜像

npm install react-native-fetch-blob --save

{
  "images": [
    {
      "name": "image1",
      "url": "https://example.com/image1.jpg"
    },
    {
      "name": "image2",
      "url": "https://example.com/image2.jpg"
    },
    {
      "name": "image3",
      "url": "https://example.com/image3.jpg"
    }
  ]
}

import React, { useEffect, useState } from 'react';
import { View, Text } from 'react-native';
import RNFetchBlob from 'react-native-fetch-blob';

const MyComponent = () => {
  const [images, setImages] = useState([]);

  useEffect(() => {
    fetchImages();
  }, []);

  const fetchImages = async () => {
    try {
      const response = await RNFetchBlob.fs.readFile(
        RNFetchBlob.fs.dirs.DocumentDir + '/images.json',
        'utf8'
      );
      const jsonData = JSON.parse(response);
      setImages(jsonData.images);
    } catch (error) {
      console.error(error);
    }
  };

  return (
    <View>
      {images.map((image, index) => (
        <Text key={index}>{image.name}: {image.url}</Text>
      ))}
    </View>
  );
};

export default MyComponent;