微信小程序媒體組件 camera

camera

基礎(chǔ)庫 1.6.0 開始支持，低版本需做兼容處理。

系統(tǒng)相機(jī)。

需要用戶授權(quán) scope.camera

相關(guān)api：wx.createCameraContext

Bug & Tip

1. tip: camera 組件是由客戶端創(chuàng)建的原生組件，它的層級(jí)是最高的，不能通過 z-index 控制層級(jí)?？墒褂?nbsp;cover-view cover-image覆蓋在上面。
2. tip: 同一頁面只能插入一個(gè) camera 組件。
3. tip: 請勿在 scroll-view、swiper、picker-view、movable-view 中使用 camera 組件。

示例：

<!-- camera.wxml -->
<camera device-position="back" flash="off" binderror="error" style="width: 100%; height: 300px;"></camera>
<button type="primary" bindtap="takePhoto">拍照</button>
<view>預(yù)覽</view>
<image mode="widthFix" src="{{src}}"></image>

// camera.js
Page({
    takePhoto() {
        const ctx = wx.createCameraContext()
        ctx.takePhoto({
            quality: 'high',
            success: (res) => {
                this.setData({
                    src: res.tempImagePath
                })
            }
        })
    },
    error(e) {
        console.log(e.detail)
    }
})