React Native хранит изображения для автономного использования

Question

Приложение My React Native получает данные (продукты) от API, который содержит массив объектов, каждый объект имеет ссылку на изображение. Существует возможность загрузить все продукты для просмотра в автономном режиме (для этого я использую redux-persist + realm ), но проблема в том, что сами изображения загружаются не только ссылки для них. Как лучше всего загрузить фотографии, чтобы я мог прикрепить их к соответствующим продуктам?

Answer 1

Существует несколько способов сделать это вручную: вы можете загрузить все изображения как base64, используя их адреса, полученные из ответа API. вы должны использовать JavaScript для их загрузки, чтобы увидеть загрузку JavaScript base64:

const imageLink = 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png';

fetch(imageLink)
  .then(res => res.blob())
  .then(data => {
    const reader = new FileReader();
    reader.readAsDataURL(data);
    reader.onloadend = () => {
      const base64data = reader.result;
      console.log(base64data); // you can store it in your realm
    };
  });

После загрузки каждого изображения сохраните его в вашей локальной базе данных realm и при использовании вызовите его из realm.

Есть и другие способы, такие как использование библиотек для захвата изображений. как response-native-cached-image .