|
3 | 3 | <view class="u-demo-wrap">
|
4 | 4 | <view class="u-demo-title">演示效果</view>
|
5 | 5 | <view class="u-demo-area">
|
6 |
| - <u-avatar :mode="mode" :size="size" :src="src" :text="text"> |
7 |
| - </u-avatar> |
| 6 | + <u-avatar |
| 7 | + :mode="mode" |
| 8 | + :size="size" |
| 9 | + :src="src" |
| 10 | + :text="text" |
| 11 | + :showLevel="showLevel" |
| 12 | + :showSex="showSex" |
| 13 | + :sexIcon="sexIcon" |
| 14 | + :bgColor='bgColor' |
| 15 | + ></u-avatar> |
8 | 16 | </view>
|
9 | 17 | </view>
|
10 | 18 | <view class="u-config-wrap">
|
|
15 | 23 | <view class="u-item-title">模式选择</view>
|
16 | 24 | <u-subsection vibrateShort :list="['圆形', '圆角方形']" @change="modeChange"></u-subsection>
|
17 | 25 | </view>
|
| 26 | + <view class="u-config-item"> |
| 27 | + <view class="u-item-title">性别选择</view> |
| 28 | + <u-subsection vibrateShort :list="['男', '女', '不显示']" @change="sexChange"></u-subsection> |
| 29 | + </view> |
| 30 | + <view class="u-config-item"> |
| 31 | + <view class="u-item-title">等级</view> |
| 32 | + <u-subsection vibrateShort :list="['显示', '不显示']" @change="levelChange"></u-subsection> |
| 33 | + </view> |
18 | 34 | <view class="u-config-item">
|
19 | 35 | <view class="u-item-title">自定义内容</view>
|
20 |
| - <u-subsection vibrateShort current="1" :list="['默认', '图片', '文字']" @change="styleChange"></u-subsection> |
| 36 | + <u-subsection vibrateShort current="0" :list="['图片', '文字']" @change="styleChange"></u-subsection> |
21 | 37 | </view>
|
22 | 38 | <view class="u-config-item">
|
23 | 39 | <view class="u-item-title">尺寸</view>
|
|
34 | 50 | mode: 'circle',
|
35 | 51 | src: 'http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg',
|
36 | 52 | text: '', // 优先级比src高
|
37 |
| - size: '90' |
| 53 | + size: '90', |
| 54 | + showLevel: true, |
| 55 | + showSex: true, |
| 56 | + sexIcon: 'man', |
| 57 | + bgColor: '#fcbd71' |
38 | 58 | }
|
39 | 59 | },
|
40 | 60 | methods: {
|
|
43 | 63 | },
|
44 | 64 | styleChange(index) {
|
45 | 65 | if(index == 0) {
|
46 |
| - this.src = ''; |
47 |
| - this.text = ''; |
48 |
| - } else if(index == 1) { |
49 | 66 | this.text = '';
|
50 | 67 | this.src = 'http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg';
|
51 | 68 | } else {
|
|
54 | 71 | },
|
55 | 72 | sizeChange(index) {
|
56 | 73 | this.size = index == 0 ? 'large' : index == 1 ? 'default' : index == 2 ? 'mini' : 160;
|
| 74 | + }, |
| 75 | + sexChange(index) { |
| 76 | + this.showSex = true; |
| 77 | + if(index == 0) this.sexIcon = 'man'; |
| 78 | + if(index == 1) this.sexIcon = 'woman'; |
| 79 | + if(index == 2) this.showSex = false; |
| 80 | + }, |
| 81 | + levelChange(index) { |
| 82 | + this.showLevel = !index; |
57 | 83 | }
|
58 |
| - |
59 | 84 | }
|
60 | 85 | }
|
61 | 86 | </script>
|
|
0 commit comments