使用ReactNative怎么實現一個圖片上傳功能

使用ReactNative怎么實現一個圖片上傳功能？針對這個問題，這篇文章詳細介紹了相對應的分析和解答，希望可以幫助更多想解決這個問題的小伙伴找到更簡單易行的方法。

解決方案：

采用FormData來實現，FormData 的API參考：https://developer.mozilla.org/zh-CN/docs/Web/API/FormData

利用FormData對象,你可以使用一系列的鍵值對來模擬一個完整的表單,然后使用XMLHttpRequest發送這個"表單".

那么我們就來看看在RN里怎么做，貼代碼：

uploadImage(){ 
 let formData = new FormData(); 
 let file = {uri: uri, type: 'multipart/form-data', name: 'a.jpg'}; 
 
 formData.append("images",file); 
 
 fetch(url,{ 
 method:'POST', 
 headers:{ 
  'Content-Type':'multipart/form-data', 
 }, 
 body:formData, 
 }) 
 .then((response) => response.text() ) 
 .then((responseData)=>{ 
 
 console.log('responseData',responseData); 
 }) 
 .catch((error)=>{console.error('error',error)}); 
 
}

1、首先我們new了一個FormData

2、創建一個file對象，uri是什么？如下示例：

Android:  file:///storage/emulated/0/Pictures/eb645893-4c00-44a3-a9b4-a2116e955f7c.jpg

ios: /Users/ashleydw/Library/Developer/CoreSimulator/Devices/23EE88D0-6E91-43AD-A3B6-06F87698C5A8/data/Containers/Data/Application/A73E68D3-7424-4301-9934-AD0F8251C1EB/tmp/7803DA8A-0E40-4FCB-A593-884805878172.jpg

3、設置header

'Content-Type':'multipart/form-data',

關于使用ReactNative怎么實現一個圖片上傳功能問題的解答就分享到這里了，希望以上內容可以對大家有一定的幫助，如果你還有很多疑惑沒有解開，可以關注億速云行業資訊頻道了解更多相關知識。