[improvement] Tabbar: optimize layout (#761)

packages/tabbar-item/index.less

@@ -1,7 +1,10 @@
 @import '../common/style/var.less';
 
+:host {
+  flex: 1;
+}
+
 .van-tabbar-item {
-  float: left;
   color: #666;
   height: 100%;
   display: flex;

packages/tabbar-item/index.ts

@@ -13,8 +13,7 @@ VantComponent({
   },
 
   data: {
-    active: false,
-    count: 0
+    active: false
   },
 
   methods: {
@@ -26,10 +25,9 @@ VantComponent({
       this.$emit('click');
     },
 
-    setActive(data) {
-      const { active, count } = this.data;
-      if (active !== data.active || count !== data.count) {
-        this.setData(data);
+    setActive(active) {
+      if (this.data.active !== active) {
+        this.setData({ active });
       }
     }
   }

packages/tabbar-item/index.wxml

@@ -1,6 +1,5 @@
 <view
   class="van-tabbar-item {{ active ? 'van-tabbar-item--active' : '' }}"
-  style="{{ count ? 'width: ' + 100 / count + '%' : '' }}"
   bind:tap="onClick"
 >
   <view class="van-tabbar-item__icon {{ dot ? 'van-tabbar-item__icon--dot' : '' }}">

packages/tabbar/index.less

@@ -3,7 +3,8 @@
 .van-tabbar {
   width: 100%;
   height: 50px;
-  background-color: #fff;
+  display: flex;
+  background-color: @white;
 
   &--fixed {
     left: 0;

packages/tabbar/index.ts

@@ -49,10 +49,7 @@ VantComponent({
   methods: {
     setActiveItem() {
       this.data.items.forEach((item, index) => {
-        item.setActive({
-          active: index === this.data.currentActive,
-          count: this.data.items.length
-        });
+        item.setActive(index === this.data.currentActive);
       });
     },