chore:更换头像正常
This commit is contained in:
@@ -299,10 +299,6 @@
|
||||
<text class="iconfont icon-album"></text>
|
||||
<text>从相册选择</text>
|
||||
</button>
|
||||
<button class="avatar-select-action" @click="takeAvatarWithCamera">
|
||||
<text class="iconfont icon-camera"></text>
|
||||
<text>拍照上传</text>
|
||||
</button>
|
||||
<button class="avatar-select-action cancel" @click="closeAvatarSelector">
|
||||
<text>取消</text>
|
||||
</button>
|
||||
@@ -613,22 +609,66 @@ export default {
|
||||
// 从相册选择头像
|
||||
chooseAvatarFromAlbum() {
|
||||
console.log('选择从相册选择头像')
|
||||
this.selectAvatar('album')
|
||||
this.selectAvatar()
|
||||
},
|
||||
|
||||
// 拍照上传头像
|
||||
takeAvatarWithCamera() {
|
||||
console.log('选择拍照上传头像')
|
||||
this.selectAvatar('camera')
|
||||
},
|
||||
|
||||
// 统一头像选择方法
|
||||
selectAvatar(sourceType) {
|
||||
console.log('开始选择头像,来源:', sourceType)
|
||||
// 统一头像选择方法 - 仅从相册选择
|
||||
selectAvatar() {
|
||||
console.log('开始选择头像')
|
||||
|
||||
// #ifdef H5
|
||||
// H5环境下的处理 - 仅从相册选择
|
||||
const input = document.createElement('input')
|
||||
input.type = 'file'
|
||||
input.accept = 'image/*'
|
||||
input.style.display = 'none'
|
||||
|
||||
// 监听文件选择
|
||||
input.onchange = (e) => {
|
||||
const file = e.target.files[0]
|
||||
if (file) {
|
||||
// 创建临时URL
|
||||
const tempFilePath = URL.createObjectURL(file)
|
||||
|
||||
// 1. 本地预览更新
|
||||
this.localUserAvatar = tempFilePath
|
||||
|
||||
// 2. 持久化缓存(支持页面刷新后保留)
|
||||
const reader = new FileReader()
|
||||
reader.onload = (e) => {
|
||||
const base64 = e.target.result
|
||||
uni.setStorageSync('user_avatar', base64)
|
||||
}
|
||||
reader.readAsDataURL(file)
|
||||
|
||||
// 3. 通知父组件(可选,用于同步到服务器等场景)
|
||||
this.$emit('avatar-changed', tempFilePath)
|
||||
|
||||
// 4. 关闭弹窗
|
||||
this.closeAvatarSelector()
|
||||
|
||||
// 5. 提示成功
|
||||
uni.showToast({
|
||||
title: '头像更换成功',
|
||||
icon: 'success',
|
||||
duration: 1500
|
||||
})
|
||||
} else {
|
||||
// 用户取消选择
|
||||
this.closeAvatarSelector()
|
||||
}
|
||||
}
|
||||
|
||||
// 触发点击
|
||||
input.click()
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
// 微信小程序环境下,使用uni.chooseImage - 仅从相册选择
|
||||
uni.chooseImage({
|
||||
count: 1, // 仅选择1张
|
||||
sizeType: ['compressed'], // 压缩图片
|
||||
sourceType: [sourceType], // 来源:相册/相机
|
||||
sourceType: ['album'], // 仅从相册选择
|
||||
success: (res) => {
|
||||
const tempFilePath = res.tempFilePaths[0]
|
||||
|
||||
@@ -654,12 +694,14 @@ export default {
|
||||
fail: (error) => {
|
||||
console.error('选择头像失败:', error)
|
||||
// 权限拒绝处理
|
||||
if (error.errMsg.includes('deny')) {
|
||||
if (error.errMsg && error.errMsg.includes('deny')) {
|
||||
uni.showToast({
|
||||
title: '请开启相册/相机权限',
|
||||
title: '请开启相册权限',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
})
|
||||
} else if (error.errMsg && error.errMsg.includes('cancel')) {
|
||||
// 用户取消选择,不显示错误提示
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '头像选择失败,请重试',
|
||||
@@ -667,8 +709,11 @@ export default {
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
// 关闭弹窗
|
||||
this.closeAvatarSelector()
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
|
||||
// 新增:打开昵称编辑弹窗
|
||||
|
||||
Reference in New Issue
Block a user