封装图片组件

src/components/orderBtns/index.module.scss

@@ -1,6 +1,7 @@
 .btns_list{
     display: flex;
     justify-content: flex-end;
+    width: 100%;
     // margin-top: 30px;
     .scroll{
         white-space: nowrap;
@@ -9,18 +10,18 @@
     .list_scroll{
         white-space: nowrap;
         width: 100%;
-        display: flex;
-        justify-content: flex-end;
+        text-align: right;
     }
     .btns_item{
-        padding: 0 10px;
-        height: 60px;
+        padding: 0 15px;
+        width: 100px;
         border: 2px solid #dddddd;
         border-radius: 38px;
         text-align: center;
         line-height: 60px;
         font-size: $font_size;
         color: $color_font_three;
+        display:inline-block;
         &:nth-child(n+2) {
             margin-left: 32px;
         }

src/components/orderBtns/index.tsx

@@ -158,7 +158,7 @@ export default memo(({orderInfo, onClick}:Param) => {
                 <View className={styles.list_scroll}>
                     {orderBtnsList.current.map((item, index) => 
                         orderBtnsShow(item)&&<View key={item.id} className={styles.btns_item} onClick={() => submitBtns(item.id, index)}>{item.label}</View>
-                        // <View key={item.id} id={`orderBtns_${item.id}`} className={styles.btns_item} onClick={() => submitBtns(item.id, index)}>{item.label}</View>
+                        // <View key={item.id}  className={styles.btns_item} onClick={() => submitBtns(item.id, index)}>{item.label}</View>
                     )}
                 </View>
             </ScrollView>