84 lines
2.0 KiB
Plaintext
84 lines
2.0 KiB
Plaintext
<template>
|
|
<view class="container">
|
|
<text class="title">UniApp X 拍照测试</text>
|
|
|
|
<image v-if="imageUrl" :src="imageUrl" mode="aspectFit" class="preview-image"></image>
|
|
|
|
<button @click="takePhoto" type="primary">打开摄像头拍照</button>
|
|
|
|
<text v-if="errorMsg" class="error-text">{{ errorMsg }}</text>
|
|
</view>
|
|
</template>
|
|
|
|
<script lang="uts">
|
|
export default {
|
|
data() {
|
|
return {
|
|
imageUrl: '' as string,
|
|
errorMsg: '' as string
|
|
}
|
|
},
|
|
methods: {
|
|
takePhoto() {
|
|
uni.chooseImage({
|
|
count: 1,
|
|
sizeType: ['compressed'],
|
|
sourceType: ['camera'], // 只从相机选择
|
|
success: (res) => {
|
|
console.log('拍照成功:', res);
|
|
if (res.tempFilePaths && res.tempFilePaths.length > 0) {
|
|
this.imageUrl = res.tempFilePaths[0];
|
|
this.errorMsg = '';
|
|
}
|
|
},
|
|
fail: (err) => {
|
|
console.error('拍照失败:', err);
|
|
this.errorMsg = '拍照失败: ' + (err.errMsg || '未知错误');
|
|
|
|
// 权限被拒绝时引导用户去设置
|
|
if (err.errMsg && err.errMsg.includes('permission')) {
|
|
uni.showModal({
|
|
title: '权限提示',
|
|
content: '您已拒绝摄像头权限，请在设置中开启',
|
|
confirmText: '去设置',
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
uni.openSetting();
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
padding: 40px 20px;
|
|
}
|
|
|
|
.title {
|
|
font-size: 36px;
|
|
font-weight: bold;
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
.preview-image {
|
|
width: 500px;
|
|
height: 500px;
|
|
margin: 20px 0;
|
|
border: 2px solid #ddd;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.error-text {
|
|
color: #ff0000;
|
|
margin-top: 20px;
|
|
}
|
|
</style> |