分享给朋友

需求：页面中有一个分享按钮，点击之后可以分享给朋友
实现：用button组件设置 open-type="share" 属性

<button open-type="share">
    <van-icon name="share-o" />
    <view class="fs12">分享</view>
</button>

效果如下：

长按图片保存，分享朋友

需求：长按图片，会出现保存图片到相册，发送给朋友，有小程序码的时候可以出现识别小程序。
实现：用 image 标签加 show-menu-by-longpress="{{true}}" 来实现

<image class="inner" src="../../../resources/share-banner.png" 
show-menu-by-longpress="{{true}}">
</image>

效果如下：

保存到相册

使用 wx.saveImageToPhotosAlbum方法，长按保存到相册，会弹出授权

wx.saveImageToPhotosAlbum({
  filePath： '',
  success(res) { }
})

预览图片

在新页面中全屏预览图片。预览的过程中用户可以进行保存图片、发送给朋友等操作

urls：需要预览的图片链接列表
showmenu：是否显示长按菜单。默认是
current：当前显示图片的链接，默认是urls的第一张

代码如下：

wx.previewImage({
  current: '', // 当前显示图片的 http 链接
  urls: [] // 需要预览的图片 http 链接列表
})

预览视频

url:图片或视频的地址
type:资源的类型，默认为图片image, 视频video
poster：视频的封面图片
showmenu：是否显示长按菜单，默认是

代码如下：

wx.previewMedia({
    sources: [{
        url: path,
        type: 'image',
    }],
    fail: () => {
        wx.showToast({
            title: '文件预览失败',
            icon: 'none'
        })
    }
})

预览pdf

wx.downloadFile ，下载文件资源到本地，单次下载允许的最大文件为 200MB
wx.openDocument，新开页面打开文档
fileType：doc | docx | xls | xlsx | ppt | pptx | pdf

 wx.downloadFile({
    url: path,
    success: (res) => {
        const filePath = res.tempFilePath
        wx.openDocument({
            filePath: filePath,
            showMenu: true,
            fail: () => {
                wx.showToast({
                    title: '文件预览失败',
                    icon: 'none'
                })
            }
        })
    },
    fail: (res) => {
        console.log(res);
    }
})

微信小程序-分享给朋友

分享给朋友

长按图片保存，分享朋友

保存到相册

预览图片

预览视频

预览pdf