[improvement] Tabbar: jsx (#2663)

packages/tabbar/index.js

@@ -0,0 +1,60 @@
+import { use } from '../utils';
+
+const [sfc, bem] = use('tabbar');
+
+export default sfc({
+  data() {
+    return {
+      items: []
+    };
+  },
+
+  props: {
+    value: Number,
+    activeColor: String,
+    fixed: {
+      type: Boolean,
+      default: true
+    },
+    zIndex: {
+      type: Number,
+      default: 1
+    }
+  },
+
+  watch: {
+    items() {
+      this.setActiveItem();
+    },
+
+    value() {
+      this.setActiveItem();
+    }
+  },
+
+  methods: {
+    setActiveItem() {
+      this.items.forEach((item, index) => {
+        item.active = index === this.value;
+      });
+    },
+
+    onChange(active) {
+      if (active !== this.value) {
+        this.$emit('input', active);
+        this.$emit('change', active);
+      }
+    }
+  },
+
+  render(h) {
+    return (
+      <div
+        style={{ zIndex: this.zIndex }}
+        class={['van-hairline--top-bottom', bem({ fixed: this.fixed })]}
+      >
+        {this.$slots.default}
+      </div>
+    );
+  }
+});