Blame view

components/thorui/tui-white-space/tui-white-space.vue 1.09 KB
46b6767c   刘淇   init 提交到库
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
  <template>
  	<view class="tui-white__space" :class="['tui-whitespace__'+(getHeight?'':size)]" :style="getStyles"
  		@tap="handleClick">
  		<slot></slot>
  	</view>
  </template>
  
  <script>
  	export default {
  		emits: ['click'],
  		name: "tuiWhiteSpace",
  		props: {
  			//small、default、large
  			size: {
  				type: String,
  				default: 'default'
  			},
  			height: {
  				type: [Number, String],
  				default: 0
  			},
  			background: {
  				type: String,
  				default: 'transparent'
  			}
  		},
  		computed: {
  			getHeight() {
  				let styles = ''
  				const h = Number(this.height)
  				if (h && h > 0) {
  					styles += `height:${h}rpx;`
  				}
  				return styles
  			},
  			getStyles() {
  				let styles = `background:${this.background};`
  				styles += this.getHeight;
  				return styles;
  			}
  		},
  		methods: {
  			handleClick() {
  				this.$emit('click')
  			}
  		}
  	}
  </script>
  
  <style scoped>
  	.tui-white__space {
  		/* #ifndef APP-NVUE */
  		width: 100%;
  		box-sizing: border-box;
  		/* #endif */
  	}
  
  	.tui-whitespace__small {
  		height: 10rpx
  	}
  
  	.tui-whitespace__default {
  		height: 20rpx
  	}
  
  	.tui-whitespace__large {
  		height: 30rpx
  	}
  </style>