模拟器上可以实现，到真机调试的时候就会出现拍照键或者停止录制键失灵
<template>
<camera class="camera" style="width: 100%; height: 100vh;" device-position="back" flash="off" @error="takeError">
<uni-icons v-if="isStart" class="camera-btn" color= "#e9e9eb" type="circle-filled" size="80" @click="startVideo"></uni-icons>
<view v-else>
<uni-icons class="camera-btn-1" color= "#e9e9eb" type="camera" size="60" @click="takephotos"></uni-icons>
<uni-icons class="camera-btn" color= "#f29e99" custom-prefix="iconfont" type="icon-tingzhi" size="80" @click="stopVideo"></uni-icons>
</view>
</camera>
</template>
<script>
export default{
data(){
return{
isStart:true, //true显示为开始图标，false是暂停图标
photoList:[],
videoPath:'',
a:null,
}
},
onLoad() {
this.a=uni.createCameraContext();
},
methods:{
takeError(){
uni.navigateBack({
delta:1,
})
},
startVideo(){
// var that=this
uni.getSetting({
success: (res) => {
if(!res.authSetting["scope.record"]){
uni.authorize({
scope:"scope.record",
success: (res) => {
this.startRecord()
},
fail() {
uni.showModal({
content:"视频录制需要打开声音录制功能，请去设置中开启录音权限",
showCancel:false,
})
}
})
}else{
this.startRecord()
}
},
fail: (err) => {
console.log(err)
}
})
},
startRecord(){
// const a=uni.createCameraContext();
this.a.startRecord({
timeout:300,
timeoutCallback:(item)=>{
console.log(item)
},
success: (res) => {
this.isStart=false
console.log(122,res)
}
})
},
stopVideo(){
this.a.stopRecord({
// compressed:true,
success: (res) => {
this.videoPath=res.tempVideoPath
console.log(124,this.videoPath)
this.isStart=true
if(this.photoList.length>0&&this.videoPath){
let photo=JSON.stringify(this.photoList)
uni.redirectTo({
url:'/pages/index/upLoad?photo='+encodeURIComponent(JSON.stringify(this.photoList))+'&video='+res.tempVideoPath
})
}else if(this.photoList.length==0){
uni.redirectTo({
url:'/pages/index/upLoad?video='+this.videoPath
})
}
},
fail(err) {
console.log(125,err)
}
})
},
takephotos(){
console.log(11111111)
var that=this
// const ctx=uni.createCameraContext()
that.a.takePhoto({
quality: 'normal',
success: (res) => {
that.photoList.push({src:res.tempImagePath})
console.log(126,res)
},
fail(err) {
console.log("erroerroerro",err)
that.photoList=[]
},
// complete(res){
// console.log('hhhhhhh')
// }
})
},
}
}
</script>
<style lang="less" scoped>
.camera{
width: 100%; height: 100vh;
}
.camera-btn{
position: absolute;
bottom: 30px;
left: 50%;
color: #e9e9eb;
/* margin-left: -50%; */
transform: translateX(-50%);
/* text-align: center; */
&-1{
left: 0%;
position: absolute;
bottom: 40px;
left: 30px;
}
}
</style>
