1. 使用uniapp中的 uni.previewImage API 预览图片
2. 使用uniapp中的 uni.downloadFile API 下载图片
3. 使用uniapp中的 uni.saveImageToPhotosAlbum API 将图片保存到相册
- <view class="content" style="padding-top: 40px;">
- <image @click="previewImage" style="width: 200px; height: 200px; background-color: #eeeeee;" src="http://**.com/images/app/kefuerweima.png">image>
- view>
-
- <script>
-
- export default {
-
- data() {
- return {
-
- }
-
- },
-
- methods: {
-
- previewImage(e) {
- var current = e.target.dataset.src
- let that = this
- uni.previewImage({
- // showmenu:true,
- current: current,
- urls: ['http://**/images/app/kefuerweima.png'],
- longPressActions :{
- itemList:['保存图片'],
- success(data) {
- let imgurl = 'http://**/images/app/kefuerweima.png'
- that.saveImage(imgurl)
- },
- fail: function(err) {
- console.log(err.errMsg);
- }
- },
-
- })
- },
- saveImage(imgurl){
- // console.log(imgurl)
- uni.downloadFile({
- url:imgurl,
- success(res){
- // console.log(res)
- let url = res.tempFilePath
- uni.saveImageToPhotosAlbum({
- filePath:url,
- success() {
- uni.showToast({
- title:'保存成功',
- icon:"none"
- })
- },
- fail(err) {
- console.log('保存失败',err)
- uni.showToast({
- title:'保存失败',
- icon:"none"
- })
- }
- })
- }
- })
- },
- }
- }
- script>