歡迎大家加群討論
點(diǎn)擊鏈接加入群聊【ReactNative技術(shù)交流群3】:1085660877
(理論上支持所有文件格式上傳)在這里已經(jīng)實(shí)現(xiàn)文件上傳功能。以下是關(guān)鍵代碼,按照我的寫(xiě)法實(shí)現(xiàn)文件上傳是沒(méi)有問(wèn)題的。有問(wèn)題可以開(kāi)個(gè)issues。給個(gè)Star,感謝!
不多說(shuō)了直接上車(chē)!源碼地址歡迎Star ,感謝支持!
Upload.gif
關(guān)鍵代碼:
//**************文件上傳**************
uploadImage(imgAry){
console.log('imgAry', imgAry);
let formData = new FormData(); //因?yàn)樾枰蟼鞫鄰垐D片,所以需要遍歷數(shù)組,把圖片的路徑數(shù)組放入formData中
for(var i = 0;i<imgAry.length;i++){
//截取獲取文件名
var a=imgAry[i].uri;
var arr = a.split('/');
// 獲取文件名end
// 判斷文件的類(lèi)型(視頻-圖片等)end
let file = {uri: imgAry[i], type: imgAry[i].mime, name: arr[arr.length-1]}; //這里的key(uri和type和name)不能改變,
formData.append("file", file); //這里的files就是后臺(tái)需要的key
//這里的files就是后臺(tái)需要的key
}
console.log('formData', formData);
console.log('uri', imgAry[0].uri);
var request = {
imgAry,
};
console.log('request', request);
fetch('http://'+yourServerIP+'/api/resources',{
method:'POST',
headers:{
'Content-Type':'multipart/form-data',
},
body:formData,
})
// .then((response) => response.json())
.then((responseData)=>{
alert('文件上傳成功!');
console.log('responseData=',responseData);
})
.catch((error)=>{console.error('error=',error)});
},
By--ZPengs
相關(guān)文章:
1.React Native開(kāi)發(fā)錯(cuò)誤警告處理總結(jié)(已解決 !持續(xù)更新)
2.React Native開(kāi)發(fā)總結(jié)之:開(kāi)發(fā)技巧和調(diào)試技巧
3.React Native開(kāi)發(fā)總結(jié):一、開(kāi)發(fā)環(huán)境配置
4.ReactNative之Android打包APK方法(趟坑過(guò)程)
5.Android 調(diào)試錯(cuò)誤總結(jié)(ReactNative開(kāi)發(fā))(持續(xù)更新)
6.ReactNative開(kāi)發(fā)之真機(jī)測(cè)試
7.React Native開(kāi)發(fā)之iOS打包ipa發(fā)布(親測(cè)可行)