+
95
-

回答

800_auto

<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>

网友回复

我知道答案,我要回答