当前位置: 首页 > news >正文

uni-app实现web-view图片长按下载

<template><view><web-view :webview-styles="webviewStyles" :src="webUrl"></web-view></view>
</template>

uniapp的web-view中图片无法长按保存,IOS下是正常的,但是Android下长按无反应

解决方案:

下载mui.min.js,放到项目中的static下

https://github.com/dcloudio/mui/icon-default.png?t=N7T8https://github.com/dcloudio/mui/在static目录下新建script.js

// static/script.jsmui.init({gestureConfig: {longtap: true, //默认为false}
});
document.addEventListener('longtap', function(e) {mui.toast('LongPress')if (e.target.tagName == "IMG") {console.log(e.target.src);mui.plusReady(function() {mui.confirm('是否下载此图片', '确认下载', '下载', function(d) {if(d.index==0){var down = plus.downloader.createDownload(e.target.src, {}, function(e, a) {console.log(e);plus.gallery.save(e.filename,function (e) {mui.toast('下载成功,请查看相册')console.log("下载成功,请查看相册");},function (e) {console.log("下载失败");})})down.start()}})})}
})

向页面的web-view注入js

<script>export default {data() {return {webviewStyles: {}}},onReady() {// #ifdef APP-PLUSvar currentWebview = this.$scope.$getAppWebview()setTimeout(function() {let wv = currentWebview.children()[0]if (uni.getSystemInfoSync().osName == 'android') {wv.appendJsFile('_www/static/mui.min.js')setTimeout(function() {wv.appendJsFile('_www/static/script.js')}, 1000)}}, 1000);// #endif},}
</script>

mui框架将很多功能配置都集中在mui.init方法中,要使用某项功能,只需要在mui.init方法中完成对应参数配置即可,目前支持在mui.init方法中配置的功能包括:创建子页面、关闭页面、手势事件配置、预加载、下拉刷新、上拉加载、设置系统状态栏背景颜色。 

配置的参数:

mui.init({  //子页面  subpages: [{  //...  }],  //预加载  preloadPages:[  //...  ],  //下拉刷新、上拉加载  pullRefresh : {  //...  },  //手势配置  gestureConfig:{  //...  },  //侧滑关闭  swipeBack:true, //Boolean(默认false)启用右滑关闭功能    //监听Android手机的back、menu按键  keyEventBind: {  backbutton: false,  //Boolean(默认truee)关闭back按键监听  menubutton: false   //Boolean(默认true)关闭menu按键监听  },  //处理窗口关闭前的业务  beforeback: function() {  //... //窗口关闭前处理其他业务详情点击 ↑ "关闭页面"链接查看  },  //设置状态栏颜色  statusBarBackground: '#9defbcg', //设置状态栏颜色,仅iOS可用  preloadLimit:5//预加载窗口数量限制(一旦超出,先进先出)默认不限制  
})

相关文章:

uni-app实现web-view图片长按下载

<template><view><web-view :webview-styles"webviewStyles" :src"webUrl"></web-view></view> </template> uniapp的web-view中图片无法长按保存&#xff0c;IOS下是正常的&#xff0c;但是Android下长按无反应 解…...

深入理解Linux网络笔记(一):内核是如何接收网络包的

本文为《深入理解Linux网络》学习笔记&#xff0c;使用的Linux源码版本是3.10&#xff0c;网卡驱动是Intel的igb网卡驱动 Linux源码在线阅读&#xff1a;https://elixir.bootlin.com/linux/v3.10/source 1、内核是如何接收网络包的 1&#xff09;、Linux网络收包总览 在TCP/I…...

android系统目录结构

文章目录 android系统目录结构问答偏好设置保存在哪里在应用设置中点击清除数据&#xff0c;清除的是什么在应用设置中点击清除缓存&#xff0c;清除的是什么 参考 android系统目录结构 /- system (一般只有root权限才能访问)- data- app &#xff08;存放应用程序的 APK 文件…...

怒刷LeetCode的第11天(Java版)

目录 第一题 题目来源 题目内容 解决方法 方法一&#xff1a;迭代 方法二&#xff1a;递归 方法三&#xff1a;指针转向 第二题 题目来源 题目内容 解决方法 方法一&#xff1a;快慢指针 方法二&#xff1a;Arrays类的sort方法 方法三&#xff1a;计数器 方法四…...

CentOS LVM缩容与扩容步骤

为VM打快照;备份home数据;# yum install xfsdump -y [root@testCentos7 home]# xfsdump -f /dev/home.dump /home xfsdump: using file dump (drive_simple) strategy xfsdump: version 3.1.7 (dump format 3.0) - type ^C for status and control ===================…...

开发者福利!李彦宏将在百度世界大会手把手教你做AI原生应用

目录 一、写在前面 二、大模型社区 2.1 加入频道 2.2 创建应用 一、写在前面 1. “把最先进的技术用到极致&#xff0c;把最先进的应用做到极致。” 2. “每个产品都在热火朝天地重构&#xff0c;不断加深对AI原生应用的理解。” 3. “这就是真正的AI原生应用&#xff0c;这…...

堆的OJ题

&#x1f525;&#x1f525; 欢迎来到小林的博客&#xff01;&#xff01;       &#x1f6f0;️博客主页&#xff1a;✈️林 子       &#x1f6f0;️博客专栏&#xff1a;✈️ 小林的算法笔记       &#x1f6f0;️社区 :✈️ 进步学堂       &am…...

物联网网关:连接设备与云端的桥梁

物联网网关作为连接设备与云端的桥梁&#xff0c;承担着采集数据、设备远程控制、协议转换、数据传输等重要任务。物联网网关是一种网络设备&#xff0c;它可以连接多个物联网设备&#xff0c;实现设备之间的数据传输和通信。物联网网关通常具有较高的网络带宽和处理能力&#…...

ChatGPT企业版来了,速度翻倍,无使用限制

美国时间8月28日&#xff0c;OpenAI宣布了自ChatGPT推出以来最重大的新闻&#xff1a;将推出ChatGPT企业版&#xff0c;企业版ChatGPT将直接对接GPT-4&#xff0c;提供无限制访问、高级数据分析功能、定制服务等服务&#xff0c;并支持处理更长文本输入的长上下文窗口。 OpenAI…...

opencv图像像素类型转换与归一化

文章目录 opencv图像像素类型转换与归一化1、为什么对图像像素类型转换与归一化2、在OpenCV中&#xff0c;convertTo() 和 normalize() 是两个常用的图像处理函数&#xff0c;用于图像像素类型转换和归一化&#xff1b;&#xff08;1&#xff09;convertTo() 函数用于将一个 cv…...

【自学开发之旅】Flask-前后端联调-异常标准化返回(六)

注册联调&#xff1a; 前端修改&#xff1a; 1.修改请求向后端的url地址 文件&#xff1a;env.development修改成VITE_API_TARGET_URL http://127.0.0.1:9000/v1 登录&#xff1a;token验证 校验forms/user.py from werkzeug.security import check_password_hash# 登录校验…...

springcloud3 分布式事务解决方案seata之XA模式4

一 seata的模式 1.1 seata的几种模式比较 Seata基于上述架构提供了四种不同的分布式事务解决方案&#xff1a; XA模式&#xff1a;强一致性分阶段事务模式&#xff0c;牺牲了一定的可用性&#xff0c;无业务侵入 TCC模式&#xff1a;最终一致的分阶段事务模式&#xff0c;有…...

编译ctk源码

目录 前景介绍 下载The Common Toolkit (CTK) cmake-gui编译 vs2019生成 debug版本 release版本 前景介绍 CTK&#xff08;Common Toolkit&#xff09;是一个用于医学图像处理和可视化应用程序开发的工具集&#xff0c;具有以下特点&#xff1a; 基于开源和跨平台的Qt框…...

前后端分离的低代码快速开发框架

低代码开发正逐渐成为企业创新的关键工具。通过提高开发效率、降低成本、增强灵活性以及满足不同用户需求&#xff0c;低代码开发使企业能够快速响应市场需求&#xff0c;提供创新解决方案。选择合适的低代码平台&#xff0c;小成本组建一个专属于你的应用。 项目简介 这是一个…...

【Java 基础篇】Java同步代码块解决数据安全

多线程编程是现代应用程序开发中的常见需求&#xff0c;它可以提高程序的性能和响应能力。然而&#xff0c;多线程编程也带来了一个严重的问题&#xff1a;数据安全。在多线程环境下&#xff0c;多个线程同时访问和修改共享的数据可能导致数据不一致或损坏。为了解决这个问题&a…...

亿纬锦能项目总结

项目名称&#xff1a;亿纬锦能 项目链接&#xff1a;https://www.evebattery.com 项目概况: 此项目用到了 wow.js/slick.js/swiper-bundle.min.js/animate.js/appear.js/fullpage.js以及 slick.css/animate.css/fullpage.css/swiper-bundle.min.css/viewer.css 本项目是一种…...

简明 SQL 组合查询指南:掌握 UNION 实现数据筛选

在SQL中&#xff0c;组合查询是一种将多个SELECT查询结果合并的操作&#xff0c;通常使用UNION和UNION ALL两种方式。 UNION 用于合并多个查询结果集&#xff0c;同时去除重复的行&#xff0c;即只保留一份相同的数据。UNION ALL 也用于合并多个查询结果集&#xff0c;但不去除…...

【springMvc】自定义注解的使用方式

&#x1f3ac; 艳艳耶✌️&#xff1a;个人主页 &#x1f525; 个人专栏 &#xff1a;《Spring与Mybatis集成整合》 ⛺️ 生活的理想&#xff0c;为了不断更新自己 ! 1.前言 1.1.什么是注解 Annontation是Java5开始引入的新特征&#xff0c;中文名称叫注解。 它提供了一种安全…...

求二维子数组的和(剖析)

文章目录 &#x1f412;个人主页&#x1f3c5;JavaSE系列专栏&#x1f4d6;前言&#xff1a;本篇剖析一下二维子数组求和规则&#xff1a; &#x1f412;个人主页 &#x1f3c5;JavaSE系列专栏 &#x1f4d6;前言&#xff1a;本篇剖析一下二维子数组求和 规则&#xff1a; 这…...

无(低)代码开发思路介绍

无代码或者低代码开发的思路,是通过非编程代码,而是基于页面拖拉拽的方式来实现创建web应用的功能。 作为程序员我们知道私有云公有云已经实现了基础设施的web方式管理。DEVOPS把代码发布,管理也实现了web方式管理。那么我们很容易能够想到,只要把拖拉拽出来的项目自动化部…...

通用AGI终极范式:从多模态感知到意识涌现的统一理论(世毫九实验室原创研究)

通用AGI终极范式&#xff1a;从多模态感知到意识涌现的统一理论作者&#xff1a;方见华单位&#xff1a;世毫九实验室摘要本研究基于世毫九理论体系的数学框架&#xff0c;构建了通用人工智能&#xff08;AGI&#xff09;的完整理论体系和演化路径。通过建立包含拓扑复杂度、动…...

CC2530项目实战:用OLED屏做个简易温湿度显示器(基于DHT11传感器)

CC2530实战&#xff1a;基于DHT11的OLED温湿度监测系统开发指南 在嵌入式开发领域&#xff0c;将传感器数据可视化是物联网项目的核心技能之一。CC2530作为一款经典的51内核单片机&#xff0c;搭配0.96寸OLED屏幕和DHT11温湿度传感器&#xff0c;可以构建一个低成本但功能完整的…...

DDSP与神经音频合成:AI如何复刻经典合成器音色

1. 项目概述&#xff1a;当AI遇见经典合成器如果你和我一样&#xff0c;是个对复古合成器声音着迷&#xff0c;同时又对现代AI技术充满好奇的音乐制作人或开发者&#xff0c;那么最近在GitHub上出现的martinic/DrMixAISynth项目&#xff0c;绝对值得你花上一个下午的时间好好研…...

CV前沿论文实战解码:轻量化与多模态对齐的工程落地指南

1. 这不是“论文速递”&#xff0c;而是一份面向实战者的CV研究动态解码指南你点开这个标题&#xff0c;大概率不是为了收藏一份PDF列表&#xff0c;而是想快速判断&#xff1a;这篇新出的视觉论文&#xff0c;值不值得我花三小时精读&#xff1f;它背后的技术思路&#xff0c;…...

分布式缓存策略:提升应用性能和可扩展性

分布式缓存策略&#xff1a;提升应用性能和可扩展性 一、分布式缓存概述 1.1 分布式缓存的定义 分布式缓存是一种将数据存储在多个节点上的缓存系统&#xff0c;它通过在内存中存储常用数据&#xff0c;减少对后端数据库的访问&#xff0c;从而提高应用性能和可扩展性。 1.…...

中国半导体设计产业:从制造到创新的演进逻辑与未来挑战

1. 从“制造”到“设计”&#xff1a;中国半导体产业的真实图景2012年&#xff0c;当《EE Times》那篇题为“Why China?”的文章发表时&#xff0c;它所描绘的中国半导体产业图景&#xff0c;在今天看来更像是一份精准的预言书。文章里提到&#xff0c;将中国仅仅视为技术产品…...

别再死记硬背截止、放大、饱和了!用Arduino+面包板,5分钟直观演示三极管三种工作状态

用Arduino实战破解三极管工作状态的秘密 记得第一次学三极管时&#xff0c;盯着课本上那些截止区、放大区、饱和区的曲线图&#xff0c;我完全无法理解这些抽象概念和实际电路有什么关系。直到有一天&#xff0c;我在实验室里用Arduino和几个简单元件搭建了一个测试电路&#x…...

高速PCB设计实战:五种端接方案如何选型与优化

1. 高速PCB设计中的信号完整性问题 在高速PCB设计中&#xff0c;信号完整性&#xff08;SI&#xff09;问题就像城市交通拥堵一样常见。想象一下&#xff0c;当信号以GHz级别的频率在电路板上传输时&#xff0c;就像高峰期的高速公路上飞驰的跑车&#xff0c;任何一个小小的阻抗…...

从“共和国之辉”到AI原生应用:一个关于“哥布林”诞生的技术启示录

从“共和国之辉”到AI原生应用&#xff1a;一个关于“哥布林”诞生的技术启示录 2025年7月&#xff0c;一篇名为《Where the goblins came from》的文章在Hacker News上引发了超过710票的热议。当大多数技术评论者将目光聚焦于AI模型的最新突破时&#xff0c;这篇来自OpenAI的文…...

Andorid下给PDF盖骑缝章的方法—安卓手机批量盖骑缝章的方法

Andorid下给PDF盖骑缝章的方法&#xff0c;安卓手机批量盖骑缝章的方法。一、准备印章图片1。不需要制作为透明的印章&#xff0c;用白底Png格式图片即可&#xff0c;白底图片盖章时软件会自动透明并融合。2。印章边线与图片四边不要有空隙&#xff0c;如下&#xff1a;错误的&…...