调整disable切换样式的顺序

pages/component/button/buttonstatus.uvue

@@ -36,8 +36,8 @@
 </script>
 
 <template>
- <scroll-view direction="vertical" style="flex:1">
-  <view class="main">
+  <scroll-view direction="vertical" style="flex:1">
+    <view class="main">
 
       <!--type-->
       <view class="container">
@@ -105,48 +105,50 @@
           plain-false
         </button>
       </view>
-      <!--disable-->
-      <view class="container">
-        <button style="margin: 10px;" :disabled="false" :size="size_enum[size_enum_current].name"
-          :type="type_enum[type_enum_current].name" :plain="plain_boolean" @click="button_click"
-          @touchstart="button_touchstart" @touchmove="button_touchmove" @touchcancel="button_touchcancel"
-          @touchend="button_touchend" @tap="button_tap" @longpress="button_longpress" class="btn"
-          :class="default_style ? 'custom-btn' : ''" :hover-class="default_style ? 'is-hover' : 'button-hover'">
-          disable-false
-        </button>
-      </view>
-      <view class="container">
-        <button style="margin: 10px;" :disabled="true" :size="size_enum[size_enum_current].name"
-          :type="type_enum[type_enum_current].name" :plain="plain_boolean" @click="button_click"
-          @touchstart="button_touchstart" @touchmove="button_touchmove" @touchcancel="button_touchcancel"
-          @touchend="button_touchend" @tap="button_tap" @longpress="button_longpress" class="btn"
-          :class="default_style ? 'custom-btn' : ''" :hover-class="default_style ? 'is-hover' : 'button-hover'">
-          disable-true
-        </button>
-      </view>
-      <view class="container">
-        <button style="margin: 10px;position: relative;text-align:left;padding:5px;color: #ffffff;background-color: #1AAD19;
+
+    </view>
+    <view class="container">
+      <button style="margin: 10px;position: relative;text-align:left;padding:5px;color: #ffffff;background-color: #1AAD19;
         font-size: 10px;line-height: 2;" :disabled="disabled_boolean">
-          custom-btn
-        </button>
-      </view>
-      <view class="container">
-        <button style="margin: 10px;
+        custom-btn
+      </button>
+    </view>
+    <view class="container">
+      <button style="margin: 10px;
            font-size: 15px;color: red;" type="warn" plain="true" :disabled="disabled_boolean">
-          custom-btn-plain-warn
-        </button>
-      </view>
-      <view class="content">
-        <button style="margin: 10px;" type="primary" size="default" :disabled="disabled_boolean">uni-app x</button>
-        <button style="margin: 10px;" type="primary"
-          @tap="change_disabled_boolean(!disabled_boolean)">修改disabled为{{!disabled_boolean}}</button>
-      </view>
-      <view class="content">
-        <button style="margin: 10px;" type="primary" size="default" :disabled="disabled_boolean" hover-class="none">hover-class none</button>
-      </view>
+        custom-btn-plain-warn
+      </button>
+    </view>
+    <view class="content">
+      <button style="margin: 10px;" type="primary" size="default" :disabled="disabled_boolean"
+        hover-class="none">hover-class none</button>
+    </view>
 
-  </view>
-</scroll-view>
+    <view class="content">
+      <button style="margin: 10px;" type="primary" size="default" :disabled="disabled_boolean">uni-app x</button>
+      <button style="margin: 10px;" type="primary"
+        @tap="change_disabled_boolean(!disabled_boolean)">修改disabled为{{!disabled_boolean}}</button>
+    </view>
+    <!--disable-->
+    <view class="container">
+      <button style="margin: 10px;" :disabled="false" :size="size_enum[size_enum_current].name"
+        :type="type_enum[type_enum_current].name" :plain="plain_boolean" @click="button_click"
+        @touchstart="button_touchstart" @touchmove="button_touchmove" @touchcancel="button_touchcancel"
+        @touchend="button_touchend" @tap="button_tap" @longpress="button_longpress" class="btn"
+        :class="default_style ? 'custom-btn' : ''" :hover-class="default_style ? 'is-hover' : 'button-hover'">
+        disable-false
+      </button>
+    </view>
+    <view class="container">
+      <button style="margin: 10px;" :disabled="true" :size="size_enum[size_enum_current].name"
+        :type="type_enum[type_enum_current].name" :plain="plain_boolean" @click="button_click"
+        @touchstart="button_touchstart" @touchmove="button_touchmove" @touchcancel="button_touchcancel"
+        @touchend="button_touchend" @tap="button_tap" @longpress="button_longpress" class="btn"
+        :class="default_style ? 'custom-btn' : ''" :hover-class="default_style ? 'is-hover' : 'button-hover'">
+        disable-true
+      </button>
+    </view>
+  </scroll-view>
 </template>
 
 <style>
@@ -180,16 +182,17 @@
 
   .container {
     width: 100%;
-    height: 60px;
-  }
-  .is-hover {
-    color: rgba(255, 255, 255, 0.6);
-    background-color: #179b16;
-    border-color: #179b16;
-  }
-
-  .button-hover {
-    color: rgba(0, 0, 0, 0.6);
-    background-color: #dedede;
-  }
+    height: 60px;
+  }
+
+  .is-hover {
+    color: rgba(255, 255, 255, 0.6);
+    background-color: #179b16;
+    border-color: #179b16;
+  }
+
+  .button-hover {
+    color: rgba(0, 0, 0, 0.6);
+    background-color: #dedede;
+  }
 </style>