1. 程式人生 > >React Native 的Image 儲存、Picker、上傳等一系列問題

React Native 的Image 儲存、Picker、上傳等一系列問題

圖片儲存

該功能可以藉助React Native提供的CameraRoll API進行圖片儲存至相簿功能

saveToCameraRoll(tag, type?)

tag為圖片地址
1、在Android上:tag是指本地地址,即本地圖片的uri,例如: “file:///sdcard/img.png”
2、在IOS上,tag可以是本地url、assets-library、記憶體圖片中的一種
type只是檔案型別
可選項為’photo’、’video’

 /** 儲存網路圖片到本地 */
      CameraRoll.saveToCameraRoll(source,'photo', function(data) {
        console.log(data);
      }, function(err) {
        console.log(err);
      });

在IOS裝置上跑需要在Xcode上進行單獨的配置,共三步
第一步:
連結原生庫 RCTCameraRoll,由於該API是RN官方提供的,所以原生庫在node_module/react-native/Library目錄下,如圖所示,拖拽到Libraries目錄下即可

這裡寫圖片描述

第二步:
在Build Phases -> Link Binary With Libraries裡新增libRCTCameraRoll.a

這裡寫圖片描述

第三步:
需要在Info.plist中新增一條名為NSPhotoLibraryUsageDescription的鍵,然後在其值中填寫向用戶請求許可權的具體描述。編輯完成後這個鍵在Xcode中實際會顯示為Privacy - Photo Library Usage Description

這裡寫圖片描述

至此為圖片儲存至本地相簿內容

後續會持續更新圖片下載和快取的一系列策略