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


    1. <template>
    2. <view>
    3. <web-view :webview-styles="webviewStyles" :src="webUrl">web-view>
    4. view>
    5. 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

    1. // static/script.js
    2. mui.init({
    3. gestureConfig: {
    4. longtap: true, //默认为false
    5. }
    6. });
    7. document.addEventListener('longtap', function(e) {
    8. mui.toast('LongPress')
    9. if (e.target.tagName == "IMG") {
    10. console.log(e.target.src);
    11. mui.plusReady(function() {
    12. mui.confirm('是否下载此图片', '确认下载', '下载', function(d) {
    13. if(d.index==0){
    14. var down = plus.downloader.createDownload(e.target.src, {}, function(e, a) {
    15. console.log(e);
    16. plus.gallery.save(e.filename,function (e) {
    17. mui.toast('下载成功,请查看相册')
    18. console.log("下载成功,请查看相册");
    19. },function (e) {
    20. console.log("下载失败");
    21. })
    22. })
    23. down.start()
    24. }
    25. })
    26. })
    27. }
    28. })

    向页面的web-view注入js

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

    配置的参数:

    1. mui.init({
    2. //子页面
    3. subpages: [{
    4. //...
    5. }],
    6. //预加载
    7. preloadPages:[
    8. //...
    9. ],
    10. //下拉刷新、上拉加载
    11. pullRefresh : {
    12. //...
    13. },
    14. //手势配置
    15. gestureConfig:{
    16. //...
    17. },
    18. //侧滑关闭
    19. swipeBack:true, //Boolean(默认false)启用右滑关闭功能
    20. //监听Android手机的back、menu按键
    21. keyEventBind: {
    22. backbutton: false, //Boolean(默认truee)关闭back按键监听
    23. menubutton: false //Boolean(默认true)关闭menu按键监听
    24. },
    25. //处理窗口关闭前的业务
    26. beforeback: function() {
    27. //... //窗口关闭前处理其他业务详情点击 ↑ "关闭页面"链接查看
    28. },
    29. //设置状态栏颜色
    30. statusBarBackground: '#9defbcg', //设置状态栏颜色,仅iOS可用
    31. preloadLimit:5//预加载窗口数量限制(一旦超出,先进先出)默认不限制
    32. })

  • 相关阅读:
    webrtc快速入门——使用 WebRTC 拍摄静止的照片
    opencv基础-印度小哥
    深入理解Linux网络技术内幕(九)——中断和网络驱动程序
    Redis系列19:LRU内存淘汰算法分析
    前端常见的安全问题及防范措施
    Spring Cloud Stream详解
    [go]根据背景色计算文本颜色
    HTML+CSS+JS制作一个迅雷看看电影网页设计实例 ,排版整洁,内容丰富,主题鲜明,简单的网页制作期末作业
    MD文本编辑工具推荐-matktext
    阿里技术风险与效能部负责人张瓅玶:从底层资源到核心竞争力 阿里巴巴的深度用云实践
  • 原文地址:https://blog.csdn.net/watson2017/article/details/132906825