1 <template>
2 <div class="user-profile">
3 <!-- 导航栏 -->
4 <van-nav-bar
5 class="page-nav-bar"
6 title="个人信息"
7 left-arrow
8 @click-left="$router.back()"
9 />
10 <!-- /导航栏 -->
11
12 <!-- 个人信息 -->
13 <van-cell class="avatar-cell" title="头像" is-link center>
14 <van-image
15 class="avatar"
16 round
17 fit="cover"
18 src="https://img.yzcdn.cn/vant/cat.jpeg"
19 />
20 </van-cell>
21 <van-cell title="昵称" value="内容" is-link />
22 <van-cell title="性别" value="内容" is-link />
23 <van-cell title="生日" value="内容" is-link />
24 <!-- /个人信息 -->
25 </div>
26 </template>
27
28 <script>
29 export default {
30 name: 'UserProfile',
31 components: {},
32 props: {},
33 data () {
34 return {}
35 },
36 computed: {},
37 watch: {},
38 created () {},
39 mounted () {},
40 methods: {}
41 }
42 </script>
43
44 <style scoped lang="less">
45 .user-profile {
46 .avatar-cell {
47 .van-cell__value {
48 display: flex;
49 flex-direction: row-reverse;
50 }
51 .avatar {
52 width: 60px;
53 height: 60px;
54 }
55 }
56 .van-popup{
57 background-color:#f5f7f9;
58 }
59 }
60 </style>
