uniapp拍摄图片和视频
文章描述：
uniapp拍摄图片和视频以及播放
template
<template>
<view>
<button @tap="mediaClick"></button>
<video :src="src" :poster="thumb"></video>
<image :src="imgsrc"></image>
</view>
</template>script
var _self;
export default {
data() {
return {
src: '',
thumb:'',
imgsrc:''
}
},
onLoad() {
_self = this;
},
methods: {
mediaClick: function () {
var self = this;
uni.chooseMedia({
count: 1,
mediaType: ['image','video'],
sourceType: ['camera'],
success: function (res) {
console.log(res);
console.log(res.tempFiles);
if(res.type=='video'){
_self.src = res.tempFiles[0]['tempFilePath'];
_self.thumb = res.tempFiles[0]['thumbTempFilePath'];
}
if(res.type=='image'){
_self.imgsrc = res.tempFiles[0]['tempFilePath'];
}
}
});
}
}
}style
button{
background-image: url(../../static/images/icon-camera.png);
background-size: cover;
width: 48upx;
height: 50upx;
margin-bottom: 20upx;
}
video{
margin: 0 auto;
display: block;
}
image{
margin: 0 auto;
display: block;
}
icon图标
发布时间：2021/09/27
发表评论