抖音实战~分享模块~短视频下载(保存到相册)

在这里插入图片描述

一、可见范围

保存到相册、复制链接、二维码 都是前端完成的

1. 自己发布短视频

自己发布的短视频会有“保存到相册、复制链接、二维码、转为私密

2. 其他人发布短视频

其他人发布短视频,自己只能看到“保存到相册、复制链接、二维码

二、源码分析
2.1. 底部窗口popup
<view>
			<!-- 底部窗口popup -->
			<uni-popup ref="comment" type="comment">
				<uni-popup-comments :thisVlogerId="thisVlogerId" :thisVlogId="thisVlogId"></uni-popup-comments>
			</uni-popup>
			<uni-popup ref="share" background-color="#fff" type="share">
				<uni-popup-share :thisVlogerId="thisVlogerId" :thisVlogId="thisVlogId" :vlogUrl="thisVlog.url"
					:isPrivate="thisVlog.isPrivate"></uni-popup-share>
			</uni-popup>
		</view>
2.2. 实现组件uni-popup 弹出层

插件链接:https://ext.dcloud.net.cn/plugin?id=329
在这里插入图片描述
组件案例:
在这里插入图片描述

2.3. 插件涉及组件

插件包括4种组件:“uni-popup-comments、uni-popup-dialog、uni-popup-message、uni-popup-share
在这里插入图片描述

2.4. 组件改造

uni-popup-share

2.5. 关键的api

官网api:
uni.uploadFile(OBJECT)
uni.saveVideoToPhotosAlbum

涉及关键的api:uni.downloadFile、uni.saveVideoToPhotosAlbum
在这里插入图片描述
在这里插入图片描述

三、作品鉴赏
3.1. 自己发布视频

在这里插入图片描述

3.2. 其他人发布视频

在这里插入图片描述

3.3. 保存短视频

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_40816738/article/details/125466426