【报Bug】自定义拍照 takePhoto 返回null

分类：uni-app

bug反馈

产品分类： uniapp/小程序/微信

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： win10

HBuilderX类型：正式

HBuilderX版本号： 3.7.11

第三方开发者工具版本号： 1.06.2209190

基础库版本号： 2.31.1

项目创建方式： HBuilderX

操作步骤：

<template>  
    <view>  
        <camera device-position="back" flash="off" @error="error" style="width: 100%; height: 300px;"></camera>  
        <button type="primary" @click="takePhoto">拍照</button>  
        <view>预览</view>  
        <image mode="widthFix" :src="src"></image>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                src:""  
            }  
        },  
        methods: {  
             takePhoto() {  
                const ctx = uni.createCameraContext();  
                ctx.takePhoto({  
                    quality: 'high',  
                    success: (res) => {  
                        this.src = res.tempImagePath;  
                        console.log(this.src)  // 返回null  
                    }  
                });  
            },  
            error(e) {  
                console.log(e.detail);  
            }  
        }  
    }  

</script>  

<style>  
    .content {  
        display: flex;  
        flex-direction: column;  
        align-items: center;  
        justify-content: center;  
    }  

    .logo {  
        height: 200rpx;  
        width: 200rpx;  
        margin-top: 200rpx;  
        margin-left: auto;  
        margin-right: auto;  
        margin-bottom: 50rpx;  
    }  

    .text-area {  
        display: flex;  
        justify-content: center;  
    }  

    .title {  
        font-size: 36rpx;  
        color: #8f8f94;  
    }  
</style>

预期结果：

<template>  
    <view>  
        <camera device-position="back" flash="off" @error="error" style="width: 100%; height: 300px;"></camera>  
        <button type="primary" @click="takePhoto">拍照</button>  
        <view>预览</view>  
        <image mode="widthFix" :src="src"></image>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                src:""  
            }  
        },  
        methods: {  
             takePhoto() {  
                const ctx = uni.createCameraContext();  
                ctx.takePhoto({  
                    quality: 'high',  
                    success: (res) => {  
                        this.src = res.tempImagePath;  
                        console.log(this.src)  // 返回null  
                    }  
                });  
            },  
            error(e) {  
                console.log(e.detail);  
            }  
        }  
    }  

</script>  

<style>  
    .content {  
        display: flex;  
        flex-direction: column;  
        align-items: center;  
        justify-content: center;  
    }  

    .logo {  
        height: 200rpx;  
        width: 200rpx;  
        margin-top: 200rpx;  
        margin-left: auto;  
        margin-right: auto;  
        margin-bottom: 50rpx;  
    }  

    .text-area {  
        display: flex;  
        justify-content: center;  
    }  

    .title {  
        font-size: 36rpx;  
        color: #8f8f94;  
    }  
</style>

实际结果：

<template>  
    <view>  
        <camera device-position="back" flash="off" @error="error" style="width: 100%; height: 300px;"></camera>  
        <button type="primary" @click="takePhoto">拍照</button>  
        <view>预览</view>  
        <image mode="widthFix" :src="src"></image>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                src:""  
            }  
        },  
        methods: {  
             takePhoto() {  
                const ctx = uni.createCameraContext();  
                ctx.takePhoto({  
                    quality: 'high',  
                    success: (res) => {  
                        this.src = res.tempImagePath;  
                        console.log(this.src)  // 返回null  
                    }  
                });  
            },  
            error(e) {  
                console.log(e.detail);  
            }  
        }  
    }  

</script>  

<style>  
    .content {  
        display: flex;  
        flex-direction: column;  
        align-items: center;  
        justify-content: center;  
    }  

    .logo {  
        height: 200rpx;  
        width: 200rpx;  
        margin-top: 200rpx;  
        margin-left: auto;  
        margin-right: auto;  
        margin-bottom: 50rpx;  
    }  

    .text-area {  
        display: flex;  
        justify-content: center;  
    }  

    .title {  
        font-size: 36rpx;  
        color: #8f8f94;  
    }  
</style>

bug描述：

<template>  
    <view>  
        <camera device-position="back" flash="off" @error="error" style="width: 100%; height: 300px;"></camera>  
        <button type="primary" @click="takePhoto">拍照</button>  
        <view>预览</view>  
        <image mode="widthFix" :src="src"></image>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                src:""  
            }  
        },  
        methods: {  
             takePhoto() {  
                const ctx = uni.createCameraContext();  
                ctx.takePhoto({  
                    quality: 'high',  
                    success: (res) => {  
                        this.src = res.tempImagePath;  
                        console.log(this.src)  // 返回null  
                    }  
                });  
            },  
            error(e) {  
                console.log(e.detail);  
            }  
        }  
    }  

</script>  

<style>  
    .content {  
        display: flex;  
        flex-direction: column;  
        align-items: center;  
        justify-content: center;  
    }  

    .logo {  
        height: 200rpx;  
        width: 200rpx;  
        margin-top: 200rpx;  
        margin-left: auto;  
        margin-right: auto;  
        margin-bottom: 50rpx;  
    }  

    .text-area {  
        display: flex;  
        justify-content: center;  
    }  

    .title {  
        font-size: 36rpx;  
        color: #8f8f94;  
    }  
</style>

index.zip

2023-05-04 19:37 负责人:无分享