創(chuàng)新互聯(lián)www.cdcxhl.cn八線動(dòng)態(tài)BGP香港云服務(wù)器提供商,新人活動(dòng)買多久送多久,劃算不套路!
這篇文章將為大家詳細(xì)講解有關(guān)微信小程序如何實(shí)現(xiàn)上傳多張圖片、刪除圖片,小編覺得挺實(shí)用的,因此分享給大家做個(gè)參考,希望大家閱讀完這篇文章后可以有所收獲。
效果圖:
本來用的是小程序提供的 mp-uploader 上傳圖片的組件,無奈次組件刪除效果不是我想要的,只能用 wx.chooseImage進(jìn)行上傳圖片,在使用uplaodFile將圖片發(fā)送給后臺(tái)服務(wù)器。
下面直接展示代碼:
wxml:
<view class="con_titles"> <view class="con_left"> <image src="../../images/comint.png"></image> <text class="titles_t">患者病歷</text> </view> <view class="img_num">{{imgShow.length}}/6</view> </view> <view class="page__bd"> <!-- <mp-uploader style='color:#353535' bindfail="uploadError" bindsuccess="uploadSuccess" select="{{selectFile}}" upload="{{uplaodFile}}" files="{{files}}" max-count="6" title="患者病歷"></mp-uploader> --> <view class="add-image"> <view class="images-boxc" wx:for="{{imgShow}}" wx:for-item="item" wx:key="image"> <image class="image_size" data-index="{{index}}" data-src="{{item}}" src="{{item}}" bindtap="clickImage"></image> <image class="delete-image" data-index="{{index}}" src="../../images/delete_img.png" bindtap="deleteImage"></image> </view> <view class="images-add" wx:if="{{imgShow.length<6}}"> <image class="image_size image_sizen" src="../../images/add_img.png" bindtap="chooseImage"></image> </view> </view> </view>
分享標(biāo)題:微信小程序如何實(shí)現(xiàn)上傳多張圖片、刪除圖片-創(chuàng)新互聯(lián)
網(wǎng)頁地址:http://www.rwnh.cn/article24/djpjje.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供小程序開發(fā)、品牌網(wǎng)站制作、App開發(fā)、網(wǎng)站設(shè)計(jì)公司、ChatGPT、標(biāo)簽優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容