wx-qhb/pageC/personalInformation/personalInformation.vue

<template>
	<view class="page">
		<view class="content">
			<view class="header">
				<text>{{i18n.headerImg}}</text>
				<image class="header-img" src="http://pic.imeitou.com/uploads/allimg/240522/10-240522162434-50.jpg" mode=""></image>
			</view>
			<view class="bottom-text" @click="toName">
				<text>{{i18n.nickname}}</text>
				<AllRight :name="nickname"></AllRight>
			</view>
		</view>
	</view>
</template>

<script>
	import AllRight from '../mineComponent/allRight/allRight.vue'
	export default {
		components:{
			AllRight
		},
		data() {
			return {
				nickname:'张三'
			};
		},
		computed:{
			i18n(){
				return this.$t('index')
			}
		},
		mounted(){
			uni.setNavigationBarTitle({
				title:this.i18n.information
			})
		},
		methods:{
			toName(){
				uni.navigateTo({
					url:'/pageC/editName/editName'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page{
		padding: 20rpx 24rpx;
		.content{
			background-color: #fff;
			border-radius: 16rpx;
			padding: 0 20rpx;
			.header{
				display: flex;
				justify-content: space-between;
				align-items: center;
				height: 176rpx;
				border-bottom: 2rpx solid rgba(151, 151, 151, .2);
				.header-img{
					height: 116rpx;
					width: 116rpx;
					border-radius: 50%;
				}
			}
			.bottom-text{
				display: flex;
				height: 116rpx;
				justify-content: space-between; 
				align-items: center;
			}
		}
	}
</style>