\u7531\u4e8e\u5728uniapp\u5b98\u65b9\u6587\u6863\u4e2d\u7684uni-file-picker\u7ec4\u4ef6\u53ef\u5b9e\u73b0\u56fe\u7247\u4e0a\u4f20\u529f\u80fd，\u9ed8\u8ba4\u7684\u662f\u4e0a\u4f20\u5230\u81ea\u5e26\u7684\u670d\u52a1，\u6240\u4ee5\u6211\u4eec\u8981\u4fee\u6539\u6210\u81ea\u5df1\u7684\u670d\u52a1\u5668<\/p>\n
1. \u6dfb\u52a0\u00a0\u00a0:auto-upload="false"\u00a0 \u00a0\u52a0\u4e0a\u8fd9\u4e2a\u53d6\u6d88\u81ea\u52a8\u4e0a\u4f20<\/p>\n
<uni-file-picker v-model="jobAddUpdateForm.imageList" :auto-upload="false" fileMediatype="image" limit="9" :image-styles="imageStyles" @select="successData">
\n<\/uni-file-picker> <\/p>\n
2.vue2 \u5c01\u88c5mixin （vue3 \u53ef\u4ee5\u5c01\u88c5 hooks） \u65b9\u4fbf\u540e\u671f\u8c03\u7528<\/p>\n
import config from '@\/config';
\nimport {
\ngetToken
\n} from '@\/utils\/auth'; \/\/ \u5bfc\u5165\u83b7\u53d6 token \u7684\u51fd\u6570 <\/p>\n
\/\/ \u4e0a\u4f20\u56fe\u7247\u7684\u5f02\u6b65\u51fd\u6570
\nconst uploadImg = async function(tempFilePaths) {
\nconst baseUrl = config.baseUrl; \/\/ \u57fa\u7840 URL \u4ece\u914d\u7f6e\u4e2d\u83b7\u53d6
\nconst token = getToken(); \/\/ \u4f7f\u7528 getToken \u51fd\u6570\u83b7\u53d6 token
\nconst successfulUploads = []; \/\/ \u6570\u7ec4\u7528\u4e8e\u8bb0\u5f55\u6240\u6709\u6210\u529f\u4e0a\u4f20\u7684\u6587\u4ef6\u8def\u5f84 <\/p>\n
if (!tempFilePaths.length) return []; \/\/ \u5982\u679c\u6ca1\u6709\u9009\u62e9\u56fe\u7247\u5c31\u9000\u51fa，\u8fd4\u56de\u7a7a\u6570\u7ec4 <\/p>\n
\/\/ \u904d\u5386\u9009\u62e9\u7684\u56fe\u7247\u8def\u5f84
\nfor (const path of tempFilePaths) {
\ntry {
\n\/\/ \u8c03\u7528\u63a5\u53e3\u4e0a\u4f20\u6bcf\u4e00\u5f20\u56fe\u7247
\nconst [err, {
\ndata
\n}] = await uni.uploadFile({
\nurl: `${baseUrl}\/common\/upload`, \/\/ \u81ea\u5df1\u7684\u540e\u53f0\u5730\u5740
\nfilePath: path,
\nname: 'file',
\nheader: { \/\/ \u6dfb\u52a0\u8bf7\u6c42\u5934
\n'Authorization': `Bearer ${token}`, \/\/ \u5047\u8bbe\u4f60\u4f7f\u7528\u7684\u662f Bearer \u8ba4\u8bc1
\n\/\/ \u53ef\u4ee5\u6dfb\u52a0\u5176\u4ed6\u9700\u8981\u7684\u8bf7\u6c42\u5934
\n},
\n});<\/p>\n
\/\/ \u5904\u7406\u9519\u8bef\u60c5\u51b5
\nif (err) {
\nconsole.error('\u4e0a\u4f20\u9519\u8bef:', err);
\ncontinue; \/\/ \u5982\u679c\u4e0a\u4f20\u51fa\u9519，\u7ee7\u7eed\u4e0a\u4f20\u4e0b\u4e00\u5f20\u56fe\u7247
\n}
\n \/\/ \u628a\u8fd4\u56de\u7684\u6570\u636e\u8f6c\u4e3a\u5bf9\u8c61\u683c\u5f0f
\nconst dataObj = JSON.parse(data);
\nconsole.log(dataObj)
\n\/\/ \u5c06\u6bcf\u4e2a\u4e0a\u4f20\u6210\u529f\u7684\u6587\u4ef6\u8def\u5f84\u6dfb\u52a0\u5230\u6570\u7ec4\u4e2d
\nsuccessfulUploads.push(dataObj); \/\/ \u5047\u8bbe dataObj.data \u662f\u4e0a\u4f20\u540e\u7684\u6587\u4ef6\u8def\u5f84
\n} catch (error) {
\nconsole.error('\u5904\u7406\u4e0a\u4f20\u65f6\u53d1\u751f\u9519\u8bef:', error);
\ncontinue; \/\/ \u6355\u83b7\u4e0a\u4f20\u9519\u8bef\u5e76\u7ee7\u7eed
\n}
\n}<\/p>\n
\/\/ \u8fd4\u56de\u6240\u6709\u6210\u529f\u4e0a\u4f20\u7684\u6587\u4ef6\u8def\u5f84
\nreturn successfulUploads;
\n};<\/p>\n
\/\/ \u5bfc\u51fa uploadImg \u51fd\u6570
\nexport default uploadImg; <\/p>\n
\u9700\u8981\u6ce8\u610f\u7684\u662f \u8bf7\u6c42\u7684url ,\u9700\u8981\u6362\u6210\u81ea\u5df1\u7684\u63a5\u53e3\u5730\u5740<\/p>\n
3. \u5728\u4f7f\u7528\u7684\u5730\u65b9\u5f15\u5165\u5c31\u53ef\u4ee5\u4e86<\/p>\n
import uploadImg from '@\/mixin\/imageData.js';<\/p>\n
\/\/ \u4e0a\u4f20\u63a5\u53e3
\nasync successData(e){
\nconst res = await uploadImg.call(this, e.tempFilePaths)
\nconsole.log(res)
\n} <\/p>\n
\u5c31\u53ef\u4ee5\u8fd4\u56de\u4e0a\u4f20\u7684\u4fe1\u606f\u4e86<\/p>\n<\/p>\n
\u53c2\u8003：uniapp\u4e2d\u7684uni-file-picker\u7ec4\u4ef6\u4e0a\u4f20\u591a\u5f20\u56fe\u7247\u5230\u670d\u52a1\u5668，\u53ef\u6dfb\u52a0，\u9884\u89c8，\u5220\u9664\u56fe\u7247_uni-file-picker\u8be6\u7ec6\u4f7f\u7528\u6559\u5b66-CSDN\u535a\u5ba2<\/p><\/p>\n","protected":false},"excerpt":{"rendered":"
\u6587\u7ae0\u6d4f\u89c8\u9605\u8bfb1.3k\u6b21\uff0c\u70b9\u8d5e17\u6b21\uff0c\u6536\u85cf2\u6b21\u30022.vue2 \u5c01\u88c5mixin \uff08vue3 \u53ef\u4ee5\u5c01\u88c5 hooks\uff09 \u65b9\u4fbf\u540e\u671f\u8c03\u7528\u3002\u9700\u8981\u6ce8\u610f\u7684\u662f \u8bf7\u6c42\u7684url ,\u9700\u8981\u6362\u6210\u81ea\u5df1\u7684\u63a5\u53e3\u5730\u5740\u30023. \u5728\u4f7f\u7528\u7684\u5730\u65b9\u5f15\u5165\u5c31\u53ef\u4ee5\u4e86\u3002\u5c31\u53ef\u4ee5\u8fd4\u56de\u4e0a\u4f20\u7684\u4fe1\u606f\u4e86\u3002\u52a0\u4e0a\u8fd9\u4e2a\u53d6\u6d88\u81ea\u52a8\u4e0a\u4f20\u3002_uniapp uni-file-picker<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[387,87],"topic":[],"class_list":["post-28781","post","type-post","status-publish","format-standard","hentry","category-server","tag-uni-app","tag-87"],"yoast_head":"\n