parent
1304629f8d
commit
29bdb83657
@ -0,0 +1,97 @@ |
||||
<template> |
||||
<view> |
||||
<uni-row class="demo-uni-row"> |
||||
<view class="demo-uni-col dark">头像</view> |
||||
|
||||
<view class="demo-uni-col light"> |
||||
<button class="btn_dzhi" open-type="chooseAvatar" @chooseavatar="onChooseAvatar"> |
||||
<image class="pers_box" :src="url" mode="aspectFill"></image> |
||||
</button> |
||||
</view> |
||||
</uni-row> |
||||
<uni-row class="demo-uni-row"> |
||||
<view class="demo-uni-col dark">昵称</view> |
||||
|
||||
<view class="demo-uni-col light"> |
||||
<input type="nickname" v-model="username" @blur="blurname" class="nickname" placeholder="请输入昵称" /> |
||||
</view> |
||||
</uni-row> |
||||
|
||||
<button class="saveBtn" type="primary" @tap="saveProfile">保存</button> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
username: '', |
||||
url: '' |
||||
}; |
||||
}, |
||||
onShow() { |
||||
let this_ = this; |
||||
console.log(uni.getStorageSync('nickname'), uni.getStorageSync('headimgurl')); |
||||
this_.username = uni.getStorageSync('nickname'); |
||||
this_.url = uni.getStorageSync('headimgurl'); |
||||
}, |
||||
methods: { |
||||
onChooseAvatar(e) { |
||||
let this_ = this; |
||||
const avatarUrl = e.detail.avatarUrl; |
||||
this_.url = avatarUrl; |
||||
}, |
||||
blurname(e) { |
||||
let this_ = this; |
||||
this_.username = e.detail.value; |
||||
}, |
||||
saveProfile() { |
||||
let this_ = this; |
||||
uni.setStorageSync('headimgurl', this_.url); |
||||
uni.setStorageSync('nickname', this_.username); |
||||
uni.setStorageSync('oauthTime', new Date().getTime()); |
||||
uni.showToast({ |
||||
icon: 'success', |
||||
title: '保存成功!', |
||||
duration: 1500, |
||||
success: () => { |
||||
setTimeout(() => { |
||||
uni.navigateBack({ |
||||
delta: 1 |
||||
}); |
||||
}, 2000); |
||||
} |
||||
}); |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.demo-uni-row { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
width: 95%; |
||||
height: 100rpx; |
||||
align-items: center; |
||||
margin: 20rpx 2.5%; |
||||
|
||||
.pers_box { |
||||
width: 100rpx; |
||||
height: 100rpx; |
||||
} |
||||
.btn_dzhi { |
||||
padding: 0; |
||||
width: 100rpx; |
||||
height: 100rpx; |
||||
border-radius: 50%; |
||||
} |
||||
} |
||||
.saveBtn { |
||||
width: 70%; |
||||
margin: 30rpx auto; |
||||
} |
||||
.nickname { |
||||
text-align: right; |
||||
} |
||||
</style> |
Loading…
Reference in new issue