react native 上傳圖片（后面有空寫一個，完整的案例）

圖片上傳的思路很正確

https://www.jianshu.com/p/c9f030fa6754

1. 獲取圖片路徑

利用react-native-image-crop-pick 從手機中獲得圖片的地址

使用它的原因，就是比react-native-image-pick支持的功能多一些。

2. 對圖片尺寸進行壓縮

使用 react-native-image-resizer 對圖片進行尺寸上的壓縮

4. 如何想要傳給后臺，還需要將base64，轉成二進制文件形式，就需要 formData

React Native 0.62.* [TypeError: Network request failed] on file upload （正常上傳文件時遇到的問題）

https://github.com/facebook/react-native/issues/28551

關于正則表達式的使用

1. JavaScript 的replace 的回調函數，獲取標簽字符串中，img標簽src里面的值。

htmlText.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, function (match, capture) {
        console.log("src里面的值",capture);
        let t = capture.replace(/data:image\/jpeg;base64,/i, "");

        console.log("去掉base64特殊符號的圖片編碼",t);
        srcArr.push(t);
 });

//   /9j/4Ua/RXhpZgAATU0AKgAAAA

2. 取出標簽字符串中，文本內容

 let textReg = new RegExp('<[^<>]+>','g');
 let textContent = htmlText.replace(textReg ,"");
//  console.log("正文內容 =",textContent);

3. 將標簽字符串中的img屬性src的值，替換掉，置空或者自己想要替代的東西（https://stackoverflow.com/questions/1298531/regular-expression-in-javascript-replace-image-src-attribute）

root     = serviceURL("file") + "&src=" + encodeURIComponent(root);
// html itself
html     = html.replace(/src=['"](?:[^"'\/]*\/)*([^'"]+)['"]/g, "src='" + root + "/$1'");
//

posted @ 2020-07-23 18:23 tengyuxin 閱讀(732) 評論(0) 收藏舉報

刷新頁面返回頂部

tengyuxin

做自己認為正確的事

react native 上傳圖片（后面有空寫一個，完整的案例）

公告