uniapp微信小程序开发自定义相机

自定义相机，调用手机原生相机，自定义拍照或录制键。原本以为是一个很复杂或者不能实现的功能，实际使用就是使用小程序的媒体组件<camera></camera>就可以了。

<view class="">
    <camera class="camera" id="myCamera" :device-position="devicePosition" @error="onCameraError">
       <view  @click="handleClick">拍照</view>
       <view  @click="handleCut">切换摄像头</view>
    </camera>
    <image :src="tempImagePath"></image>
</view>

export default {
   data(){
      return {
        tempImagePath: '',
        devicePosition: 'front'
       }
   },
   methods: {
     onCameraError(error) {
        console.log('摄像头错误', error);
     },
     handleClick(){
       console.log('拍照');
       let cameraContext = uni.createCameraContext(); // 创建camera上下文实例
       cameraContext.takePhoto({
         quality: 'high', // 指定拍照质量
         success: (res) => {
           // 成功拍照的回调
           console.log('拍照成功', res);
           this.tempImagePath = res.tempImagePath
          },
          fail: (err) => {
            // 拍照失败的回调
            console.error('拍照失败', err);
          }
         });
       },
       onCameraError(error) {
          console.log('摄像头错误', error);
       },
       handleCut() {
          console.log('切换');
          this.devicePosition = this.devicePosition == 'front' ? 'back' : 'front'
        }
     },
    }