小程序点击删除图片或者内容

最新推荐文章于 2024-05-09 16:34:31 发布

qinyong^_^

最新推荐文章于 2024-05-09 16:34:31 发布

阅读量4.3k

点赞数

本文介绍了一个简单的小程序功能——用户可以删除已上传的图片。通过JavaScript代码实现了从图片数组中移除指定图片的功能，并更新了小程序的数据状态。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

deleteImg: function (e) {
  var imgs = this.data.imgs;
  var index = e.currentTarget.dataset.index;
  imgs.splice(index, 1);
  this.setData({
   imgs: imgs
  });
},

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

qinyong^_^

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

微信小程序实现上传图片/预览放大/删除图片功能

hiro_1015的博客

03-01

9709

// pages/common/uploadImage.js const netUtil = require("../../utils/netUtil"); const util = require("../../utils/util.js"); import {colors} from '../../utils/colors'; var app = getApp(); Page({ ...

微信小程序本地上传图片预览并删除

lfkabb的博客

09-23

633

微信小程序本地上传图片，在小程序开发文档上面有说明： wx.chooseImage(Object object) | 微信开放文档 wx.previewImage(Object object) | 微信开放文档 wxml: 图片用wx:for循环，后面用带有加号的图片。 <view class="content"> <text>微信小程序练习demo</text> <view class="upload"> ..

参与评论您还未登录，请先登录后发表或查看评论

小程序实现长按删除图片

weixin_33737774的博客

05-17

654

小程序实现长按删除图片说明最近在学小程序,遇到长按图片删除的问题,特此记录,记录自己的成长轨迹需求: 长按删除指定图片需要解决的问题长按事件如何表示出来? 如何获取当前长按元素的下标? 如何删除元素? 解决办法长按事件是用bindlongpress(不会跟点击事件bindtap冲突); 在wxml中添加索引index,然后在js中用curren...

微信小程序实现上传多张图片，删除图片

2401_84093899的博客

05-09

559

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！

微信小程序 上传、预览、删除图片

weixin_45789931的博客

05-05

1261

页面view代码 <view class="allImgBox"> <view class="img_num">{{imgs.length}}/3</view> <view class="imgBox" wx:for="{{imgs}}" wx:for-item="item" wx:key="*this"> <image src="{{item}}" data-index="{{index}}" mode="aspectFill.

微信小程序、展开/收起、组件、省略号点击后展示内容

04-05

通过以上分析，我们可以看出，"微信小程序、展开/收起、组件、省略号点击后展示内容"这个主题涵盖了小程序开发中的核心技术和用户体验设计原则。理解并掌握这些知识点，对于构建高效、友好的微信小程序至关重要。

小程序上传图片视频文件(带删除功能)demo

08-08

在微信小程序中，上传图片和视频文件是一项常见的功能，它涉及到用户...以上是实现“小程序上传图片视频文件(带删除功能)demo”所需的主要技术点。实际开发时，还需要根据具体需求和服务器环境进行适当的调整和优化。

微信小程序多图上传(支持指定压缩大小，带删除按钮)

07-15

首先，我们需要引入微信小程序的API，如`wx.chooseImage`用于选取图片，`wx.saveFile`用于保存图片到本地，`wx.uploadFile`用于上传图片到服务器，以及`wx.showModal`用于显示删除确认对话框。 1. **多图选择**：...

uniapp 微信小程序 长按删除图片

weixin_64103049的博客

10-24

737

uniapp 微信小程序 长按删除图片

微信小程序实现图片上传、删除和预览功能的方法

08-28

主要介绍了微信小程序实现图片上传、删除和预览功能的方法,涉及微信小程序界面布局、事件响应及图片操作相关实现技巧,需要的朋友可以参考下

微信小程序之删除元素

weixin_41962085的博客

05-26

7183

通常我们想要在原有的数组上删除元素的时候，该怎么做呢？下面用实例说明下： 小程序js页面的data： data:{ list:['a','b','c'] } 在方法里面，当我们要删除的时候： method:function(){ var index = 1; this.data.list.splice(index,1) this.setData({ ...

小程序多图删除

zl_j_c的博客

06-21

317

　　　　　　　　　　　　　　<view class="weui-cell"> <view class="weui-cell__bd"> <view class="weui-uploader"> ...

小程序单张图片

qq_36437172的博客

07-24

482

<view class="gallery"> <view class='tipTitle'> 快去上传自己的照片吧 </view> <view class='item-ot'> <view class="item">  <view class=&qu

微信小程序云开发上传图片和删除图片

Dipper_Dubhe的博客

06-17

2099

微信小程序云开发之图片上传与删除

微信小程序 【给图片加上删除图标】

咕噜

01-31

2062

【解决：】 <view wx:for="{{imgList}}" wx:key="index"> <image src="../../images/deletee.png" style="position: absolute;margin: 20rpx;width: 50rpx;height: 50rpx;"></image> <image src="{{item}}" style="height: 400rpx;width: 95%;margin

小程序单张图片和九宫格图片上传、预览、删除示例

weixin_33724570的博客

09-20

226

Demo下载地址：https://github.com/ybx13579/xiaochengxu-uploadImg 1、九宫格图片（一次性多张）上传预览删除代码地址：https://www.cnblogs.com/cqlb/p/9682505.html#t8效果图： 2、单张图片（单词）上传：（以下全部复制即可查看效果）示例图：Wxml: <view class...

微信小程序---手机照片上传和删除

张新丁

03-12

1089

wxml： <view class="gallery">  <view class="item" wx:for="{{images}}" wx:key="index"> <image src="{{item}}" data-src="{{item

微信小程序实现带单选框图片上传、预览、删除功能

li222248的博客

05-14

1385

功能图：功能图： .wxml:  <view class="uploader"> <view class="uploader-text">相册</view> <view class="uploade-box">  <view class="uploader-showItem" wx:for="{{imagesList}

小程序点击图片查看大图并删除