uniapp手写上传视频

效果演示：

html

<view class="add_picture">
			<label class="title">视频</label><br>
			<view class="many_photo" v-show="addVideo">
				<image src="@/static/icon1.png" @click="test"></image>
			</view>
			<view class="" v-show="showVideo" style="position: relative;">
				<video :src="src" style="video"></video>
				<image src="@/static/icon1.png" @click="DelImg" class="close-img" style="height: 36rpx;">
				</image>
			</view>
		</view>

js

	export default {
    
    
		data() {
    
    
			return {
    
    
				src: '',
				showVideo: false,
				addVideo: true,

			}
		},
		methods: {
    
    
			//点击上传视频
			test: function() {
    
    
				var self = this;
				uni.chooseVideo({
    
    
					count: 1,
					sourceType: ['camera', 'album'],
					success: function(res) {
    
    
						console.log("选择视频成功", res)
						self.showVideo = true
						self.addVideo = false
						self.src = res.tempFilePath;
						uni.uploadFile({
    
    
							url: 'http:。。。', //接口地址
							filePath: res.tempFilePath,
							name: 'files',
							// formData: {
    
    
							//     'user': 'test'
							// },
							header: {
    
    
								Authorization: 'Bearer ' + uni.getStorageSync('access')
							},
							success: (uploadFileRes) => {
    
    
								console.log('1张', uploadFileRes);
								let bold = JSON.parse(uploadFileRes.data)
								console.log(bold)
								console.log(bold.result[0].filePath)
								self.returnImage = bold.result[0].filePath + bold.result[0]
									.fileName
								console.log("this.returnImage", self.returnImage)
							},

						});
					}
				});
			},
			//右上角删除视频
			DelImg() {
    
    
				this.src = '',
					this.showVideo = false,
					this.addVideo = true
			},

		}
	}
</script>

css

	.close-img {
    
    
		position: absolute;
		height: 36rpx !important;
		width: 36rpx !important;
		top: -18rpx;
		right: -18rpx;
	}