更新numberbox示例结构

fang-kang · Nov 12, 2018 · 12d3c68 · 12d3c68
1 parent cc69832
commit 12d3c68
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 59 deletions.
diff --git a/examples/hello-uniapp/common/uni.css b/examples/hello-uniapp/common/uni.css
@@ -779,6 +779,8 @@ radio-group label, checkbox-group label{
 	display: flex;
 	flex-direction: row;
 	font-size:28upx;
+	padding: 22upx 30upx;
+	justify-content: space-between;
 }
 
 .uni-input-group .uni-input-row:after {
@@ -792,11 +794,6 @@ radio-group label, checkbox-group label{
 	background-color: #c8c7cc;
 }
 
-.uni-input-row {
-	padding: 22upx 30upx;
-	justify-content: space-between;
-}
-
 .uni-input-row label {
 	line-height: 70upx;
 }

diff --git a/examples/hello-uniapp/pages/template/number-box/number-box.vue b/examples/hello-uniapp/pages/template/number-box/number-box.vue
@@ -1,53 +1,26 @@
 <template>
 	<view class="page">
 		<page-head :title="title"></page-head>
-		<view class="uni-padding-wrap">
-			<view class="uni-hello-text uni-common-mt">默认</view>
-			<view class="uni-hello-items">
+		<view class="uni-input-group uni-common-mt">
+			<view class="uni-input-row">
+				<label>默认</label>
 				<number-box></number-box>
 			</view>
-
-			<view class="uni-hello-text uni-common-mt">限定最小值和最大值（0~9）</view>
-			<view class="uni-hello-items">
+			<view class="uni-input-row">
+				<label>限定最小值和最大值</label>
 				<number-box :min="0" :max="9"></number-box>
 			</view>
-
-			<view class="uni-hello-text uni-common-mt">设定步长值（步长10）</view>
-			<view class="uni-hello-items">
+			<view class="uni-input-row">
+				<label>设定步长值（步长10）</label>
 				<number-box :step="10"></number-box>
 			</view>
-
-			<view class="uni-hello-text uni-common-mt">获取输入框的值</view>
-			<view class="uni-hello-items">
-				<view class="uni-inline-item">
-					<number-box v-on:change="onNumberChange"></number-box>
-					<text class="item-label-right">当前的值为：{{numberValue}}</text>
-				</view>
-			</view>
-
-			<view class="uni-hello-text uni-common-mt">输入框只读</view>
-			<view class="uni-hello-items">
+			<view class="uni-input-row">
+				<label>输入框只读</label>
 				<number-box :disabled="true"></number-box>
 			</view>
-
-			<view class="uni-hello-text uni-common-mt">在行内</view>
-			<view class="uni-hello-items">
-				<view class="uni-inline-item">
-					<text class="item-label">购买数量：</text>
-					<number-box></number-box>
-				</view>
-			</view>
-
-			<view class="uni-hello-text uni-common-mt">在表单中</view>
-			<view class="uni-input-group">
-				<view class="uni-input-row">
-					<label>数字框一</label>
-					<number-box></number-box>
-				</view>
-				<view class="uni-input-row">
-					<label>数字框二</label>
-					<number-box></number-box>
-				</view>
+			<view class="uni-input-row">
+				<label>获取输入的值 : {{numberValue}}</label>
+				<number-box v-on:change="onNumberChange"></number-box>
 			</view>
 		</view>
 		<view style="height:80upx;"></view>
@@ -74,18 +47,4 @@
 	}
 </script>
 <style>
-	.uni-hello-items{
-		padding:10upx 0;
-	}
-	
-	.item-label {
-		line-height: 70upx;
-		font-size:28upx;
-	}
-
-	.item-label-right {
-		font-size:28upx;
-		line-height: 70upx;
-		margin-left: 20upx;
-	}
-</style>
+</style>