<template> <view> <!-- 使用 <camera> 组件来预览摄像头 --> <camera :device-position="cameraPosition" style="width: 100%; height: 400px;"></camera> <!-- 拍照按钮 --> <button @tap="takePhoto">拍照</button> <!-- 录像按钮 --> <button @tap="startRecording" v-if="!isRecording">开始录像</button> <button @tap="stopRecording" v-if="isRecording">停止录像</button> </view> </template> <script> export default { data() { return { cameraPosition: 'back', // 摄像头位置,'front'表示前置摄像头,'back'表示后置摄像头 isRecording: false, // 录像状态 cameraContext: null, // 摄像头上下文对象 }; }, mounted() { // 获取摄像头上下文对象 this.cameraContext = uni.createCameraContext(); }, methods: { // 拍照操作 takePhoto() { this.cameraContext.takePhoto({ success: (res) => { // res.tempImagePath 是拍照后的临时文件路径,可以在此处进行处理 console.log('拍照成功', res.tempImagePath); }, fail: (err) => { console.error('拍照失败', err); }, }); }, // 开始录像操作 startRecording() { this.cameraContext.startRecord({ success: () => { console.log('开始录像'); this.isRecording = true; }, fail: (err) => { console.error('开始录像失败', err); }, }); }, // 停止录像操作 stopRecording() { this.cameraContext.stopRecord({ success: (res) => { // res.tempVideoPath 是录像后的临时文件路径,可以在此处进行处理 console.log('停止录像', res.tempVideoPath); this.isRecording = false; }, fail: (err) => { console.error('停止录像失败', err); this.isRecording = false; }, }); }, }, }; </script>
网友回复