uniapp中实现保存图片,复制信息功能函数的封装

1.首先在until文件中创建common.js文件(根据你自己的实际情况定,重点在下边的函数封装中)


// 复制信息
export function copyData (data) {
  uni.setClipboardData({
      data: data,
      success: function () {
          uni.showToast({
              title: '复制成功'
          })
      }
  });
}


  // 保存图片
export function saveImage (image){
    // #ifdef MP
    // 获取用户的当前设置
    uni.getSetting({
        success: (res) => {
            if (res.authSetting['scope.writePhotosAlbum']) { // 验证用户是否授权可以访问相册
                handleDownload(image);
            } else {
                uni.authorize({ // 如果没有授权,向用户发起请求
                    scope: 'scope.writePhotosAlbum',
                    success: () => {
                        handleDownload(image);
                    },
                    fail: () => {
                        uni.showModal({
                            content: '由于您还没有允许保存图片到您相册里,无法进行保存,请点击确定允许授权',
                            success: (res) => {
                                if (res.confirm) {
                                    uni.openSetting({
                                        success: (result) => {
                                            console.log(result.authSetting);
                                        }
                                    });
                                }
                            }
                        });
                    }
                })
            }
        }
    })
    // #endif
    // #ifdef APP-PLUS
    handleDownload(image);
    // #endif
    // #ifdef H5
    // 判断是否H5微信环境,true为微信浏览器
    const ua = navigator.userAgent.toLowerCase()
    if (ua.match(/MicroMessenger/i) == 'micromessenger') {
        vm.$u.toast('长按二维码保存');
        return;
    }
    uni.hideLoading();
    const oA = document.createElement("a");
    oA.download = new Date().getTime(); // 设置下载的文件名,默认是'下载'
    oA.href = image; // 临时路径再保存到本地
    document.body.appendChild(oA);
    oA.click();
    oA.remove(); // 下载之后把创建的元素删除
    uni.showToast({title: '保存成功',});
    // #endif
}

// 下载图片
export function handleDownload  (url){
  uni.getImageInfo({
      src: url,
      success: res => {
          uni.saveImageToPhotosAlbum({
              filePath: res.path,
              success: function () {
                  uni.showToast({
                      title: '保存成功',
                      duration: 2000
                  })
              },
              fail: async function () {
                  // #ifdef APP-PLUS
                  const systemInfo = uni.getSystemInfoSync();
                  if (systemInfo.platform == 'android') {
                      let storage = await permission.requestAndroidPermission('android.permission.WRITE_EXTERNAL_STORAGE');
                      if (storage == 0 || storage == -1) {
                          toAppPermissionSetting('需要开启相册使用权限');
                          return;
                      }
                  } else {
                      let photoLibrary = permission.judgeIosPermission("photoLibrary"); // 判断ios是否给予相册权限
                      if (!photoLibrary) {
                          toAppPermissionSetting('需要开启相册使用权限');
                      }
                  }
                  // #endif
                  uni.showToast({
                      title: '保存失败',
                      duration: 2000
                  })
              }
          })
      }
  })
}

2,上述代码就是封装的功能函数,需要用的时候在页面组件中引入该函数,然后methods中直接使用

3.方法很简单具体,如果对大家有帮助麻烦点亮小红星啦,感谢各位大佬。

  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

子伟-H5

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值