feat(tabbar): support reactive tabbar

Author: Tidyzq

src/tabbar/tabbar.less

@@ -0,0 +1,20 @@
+@import "../../src/weui-wxss/src/style/base/fn";
+
+@media only screen and (min-width: 450px) {
+  .weui-tabbar {
+    flex-direction: column;
+
+    width: 60px;
+    height: 100%;
+
+    &:before {
+      left: unset;
+      height: unset;
+      .setRightLine(@weuiLineColorLight);
+    }
+  }
+
+  .weui-tabbar__item {
+    flex: none;
+  }
+}

tools/demo/example/tabbar/tabbar.wxml

@@ -3,5 +3,5 @@
         <view class="page__title">Tabbar</view>
         <view class="page__desc">类似小程序原生tabbar的组件，可用于自定义tabbar</view>
     </view>
-    <mp-tabbar style="position:fixed;bottom:0;width:100%;left:0;right:0;" list="{{list}}" bindchange="tabChange"></mp-tabbar>
+    <mp-tabbar class="tabbar" list="{{list}}" bindchange="tabChange"></mp-tabbar>
 </view>

tools/demo/example/tabbar/tabbar.wxss

@@ -1,2 +1,26 @@
 /* example/tabbar/tabbar.wxss */
 @import '../common.wxss';
+
+@media only screen and (min-width: 450px) {
+  .page__hd {
+    margin-left: 60px;
+  }
+
+  .tabbar {
+    position:fixed;
+    top: 0;
+    bottom:0;
+    width: unset;
+    height: 100%;
+    left:0;
+    right: unset;
+  }
+}
+
+.tabbar {
+  position:fixed;
+  bottom:0;
+  width:100%;
+  left:0;
+  right:0;
+}