【uniapp】uview1.x 的 u-upload 上传点击删除隐藏 modal 提示框

uview1.x 版本的 upload 默认在图片成功上传后,再点击右上角删除按钮时会弹出提示框,如图:

但是有时又不需要,想要直接提示删除成功即可,由于官网没有给出点击删除按钮时所调用的钩子函数,又无法操作 DOM,只有删除成功时的回调;

所以可以直接在项目中的 uview-ui 文件夹中找到 u-upload 组件来修改源码:

其中 deleteItem 函数时点击删除时调用的函数,里面的代码修改为:

javascript 复制代码
if (this.beforeRemove && typeof (this.beforeRemove) === 'function') {
		// 此处钩子执行 原理同before-remove参数,见上方注释
		let beforeResponse = this.beforeRemove.bind(this.$u.$parent.call(this))(index,
			this.lists)
		// 判断是否返回了promise
		if (!!beforeResponse && typeof beforeResponse.then === 'function') {
			beforeResponse.then(res => {
				// promise返回成功,不进行动作,继续上传
				this.handlerDeleteItem(index)
			}).catch(err => {
				// 如果进入promise的reject,终止删除操作
				this.showToast('已终止移除')
			})
		} else if (beforeResponse === false) {
			// 返回false,终止删除
			this.showToast('已终止移除')
		} else {
			// 如果返回true,执行删除操作
			this.handlerDeleteItem(index)
		}
} 
else {
	// 如果不存在before-remove钩子,
	this.handlerDeleteItem(index)
}

即可,这样删掉 uni.showModal 就不会再弹弹窗了,只会进行删除成功的消息提示框。

相关推荐
竹林81825 分钟前
用 wagmi v2 + viem 监听链上事件,我踩了三天坑终于搞懂了实时日志与历史补全
javascript
Momo__29 分钟前
VueUse createReusableTemplate —— 单文件组件内的模板复用神器
前端·vue.js
只一32 分钟前
😭从回调地狱到 async/await:一文打通 Ajax 与 JS 异步编程
javascript
程序员小富35 分钟前
我开源了一个开发者专属的智能 JSON 工具,得到了媳妇高度认可
前端·vue.js·后端
小小小小宇35 分钟前
程序员如何给 LLM 装工具以及看懂推理过程
前端
写代码的皮筏艇35 分钟前
React中的forwardRef
前端·react.js·面试
槑有老呆44 分钟前
花三个月工资请了个 AI 程序员,结果它连青岛啤酒股价都查不了
前端
风骏时光牛马1 小时前
Verilog开发常见问题汇总解析
前端
子兮曰1 小时前
AI Coding Method Map:一张图看懂 AI 编程的完整链路
前端·人工智能·后端