修改个人信息

﹏ヽ暗。殇╰゛Y 2022-01-06 08:21 233阅读 0赞

## 哈哈哈修改个人信息，我用了好久成功了 ##

包含修改头像、昵称、性别、生日、收货地址

以下是我的代码块分享 …吼吼吼

<template>
    	<view class="uni-all">
    		<view class="uni-back">
    			<hr style="background: #e2e2e2;border: none;height: 0.2rem;" />
    			<view class="tou" v-if="avatar==null">
    				<view @tap="chooseimg">
    					<image :src="images"></image>
    				</view>
    				<view style="color: #acacac;">上传头像</view>
    			</view>
    			<view class="tou" v-if="avatar!=null">
    				<view @tap="excaimg">
    					<image :src="avatar"></image>
    				</view>
    				<view style="color: #acacac;">更改头像</view>
    			</view>
    			<hr style="background: #e2e2e2;border: none;height: 0.2rem;" />
    			<view class="hq" @click="name">
    				<view class="zi">昵称</view>
    				<view class="zi-tele" v-model="username">{ { username}}</view>
    				<view class="iconfont"></view>
    			</view>
    			<hr style="background: #e2e2e2;border: none;height:3upx;width: 90%;margin-left: 50upx;" />
    			<view class="hq" @click="sex">
    				<view class="zi">性别</view>
    				<view class="zi-tele" v-model="gender" v-if="gender==1">男</view>
    				<view class="zi-tele" v-model="gender" v-if="gender==0">女</view>
    				<view class="iconfont"></view>
    			</view>
    			<hr style="background: #e2e2e2;border: none;height:3upx;width: 90%;margin-left: 50upx;" />
    			<view class="hq">
    				<view class="zi">生日</view>
    				<picker mode="date" :value="birthday" :start="startDate" :end="endDate" @change="bindDateChange">
    					<view class="uni-input" v-model="birthday">{ { birthday}}</view>
    				</picker>
    				<view class="iconfont"></view>
    			</view>
    			<hr style="background: #e2e2e2;border: none;height: 0.2rem; margin-left: 50upx;" />
    			<view class="hq" @tap="getAddress">
    				<view class="zi">收货地址</view>
    				<view class="iconfont"></view>
    			</view>
    			<hr style="background: #e2e2e2;border: none;height: 0.2rem; margin-left: 50upx;" />
    			<view class="hq" @tap="exchangePwd">
    				<view class="zi">修改密码</view>
    				<view class="iconfont"></view>
    			</view>
    			<hr style="background: #e2e2e2;border: none;height: 0.2rem; margin-left: 50upx;" />
    
    		</view>
    		<view class="uni-comment" @tap="comment">
    			确定提交
    		</view>
    		
    		<view class="bg" v-if='all'>
    			<view class="bg-bei">
    				修改姓名
    				<input class="bg-input" type="text" v-model="nick" placeholder="请输入昵称" />
    				<view class="bg-comment" @tap="yin">
    					<view class="ok" @change="onKeyInput" @tap="mynick">
    						确定
    					</view>
    					<view class="quxiao" @tap="quxiao">
    						取消
    					</view>
    				</view>
    			</view>
    		</view>
    	</view>
    </template>
    
    <script>
    	import { 
    		pathToBase64,
    		base64ToPath
    	} from '@/common/index.js'
    
    	function getDate(type) { 
    		const birthday = new Date();
    
    		let year = birthday.getFullYear();
    		let month = birthday.getMonth() + 1;
    		let day = birthday.getDate();
    
    		if (type === 'start') { 
    			year = year-40;
    		} else if (type === 'end') { 
    			year = year;
    		}
    		month = month > 9 ? month : '0' + month;;
    		day = day > 9 ? day : '0' + day;
    
    		return `${ year}-${ month}-${ day}`;
    	}
    	export default { 
    		data() { 
    			var that = this
    			return { 
    				title: "个人信息界面",
    				stop: false,
    				images: '../../static/icc.png',
    				all: false,
    				username: '',
    				avatar: '../../static/icc.png',
    				gender: '',
    				birthday: getDate('end'),
    				startDate: getDate('start'),
    				endDate: getDate('end'),
    				nick: ''
    			}
    		},
    		methods: { 
    			onKeyInput: function(event) { 
    				this.nick = event.target.username
    			},
    			name() { 
    				var that = this
    				that.all = true
    			},
    			yin() { 
    				let that = this
    				that.all = false
    			},
    			sex() { 
    				var that = this
    				uni.showActionSheet({ 
    					itemList: ['女', '男'],
    					success: function(res) { 
    						// alert('选中了第' + (res.tapIndex + 1) + '个按钮');
    						that.gender = res.tapIndex
    					},
    					fail: function(res) { 
    						console.log(res.errMsg);
    					}
    				});
    			},
    			bindDateChange: function(e) { 
    				this.birthday = e.target.value
    				console.log(this.birthday)
    			}
    </style>

看上去很乱，，，但是功能还是有的 、、、、、 哈哈哈哈