uni-app項目保存圖片到相冊

github地址，喜歡的可以star下哦

插件預覽圖

功能介紹

1.長按保存圖片
2.右下角圖片點擊保存圖片
3.點擊圖片可以隱藏圖片

使用教程

1.插件代碼拷貝

• 下載後把components目錄下saveFile.vue文件拷貝到自己項目目錄下

2.插件全局配置

• 在項目裏main.js中配置如下代碼

import savefile from './components/saveFile.vue'

Vue.component('savefile',savefile)

3.插件使用

• vue頁面使用

<template>
    <view>
        <!-- 預覽圖片 -->
        <savefile v-if="isShowPhoto" :url="qrUrl" @hide="hidePhoto"></savefile>
    </view>
</template>

<script>
export default {
    data() {
        return {
            qrUrl:'/static/img/img1.jpg',
            isShowPhoto:true,
        };
    },
    onLoad() {},
    methods: {
        hidePhoto(){
            this.isShowPhoto = false;
            uni.showToast({
                title:'圖片已隱藏',
                icon:'none'
            })
        }
    }
};
</script>

兼容性

uni-app項目中使用都兼容 除了H5