You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
97 lines
2.0 KiB
97 lines
2.0 KiB
<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>
|
|
|