[new feature] add i18n support (#310)

* fix: Tabbar icon line-height * [new feature] progress add showPivot prop * [new feature] TabItem support vue-router * [new feature] update document header style * [Doc] add toast english ducoment * [new feature] add i18n support * feat: Extract demos from markdown * feat: Base components demos * [new feature] complete demo extract & translate * [fix] text cases * fix: add deepAssign test cases * fix: changelog detail * [new feature] AddressEdit support i18n
2017-11-15 20:08:51 -06:00
parent 05abf0d509
commit d8b6ad7d54
210 changed files with 5561 additions and 5528 deletions
@@ -0,0 +1,60 @@
+<template>
+  <demo-section>
+    <demo-block :title="$t('basicUsage')">
+      <van-tabbar v-model="active">
+        <van-tabbar-item icon="shop">{{ $t('tab') }}</van-tabbar-item>
+        <van-tabbar-item icon="chat" dot>{{ $t('tab') }}</van-tabbar-item>
+        <van-tabbar-item icon="records" info="5">{{ $t('tab') }}</van-tabbar-item>
+        <van-tabbar-item icon="gold-coin" info="20">{{ $t('tab') }}</van-tabbar-item>
+      </van-tabbar>
+    </demo-block>
+
+    <demo-block :title="$t('title2')">
+      <van-tabbar v-model="active2">
+        <van-tabbar-item icon="shop">
+          <span>{{ $t('custom') }}</span>
+          <img slot="icon" :src="active2 === 0 ? icon.active : icon.normal" />
+        </van-tabbar-item>
+        <van-tabbar-item icon="chat">{{ $t('tab') }}</van-tabbar-item>
+        <van-tabbar-item icon="records">{{ $t('tab') }}</van-tabbar-item>
+      </van-tabbar>
+    </demo-block>
+  </demo-section>
+</template>
+
+<script>
+export default {
+  i18n: {
+    'zh-CN': {
+      title2: '自定义图标'
+    },
+    'en-US': {
+      title2: 'Custom icon'
+    }
+  },
+
+  data() {
+    return {
+      active: 0,
+      active2: 0,
+      icon: {
+        normal: 'https://img.yzcdn.cn/public_files/2017/10/13/c547715be149dd3faa817e4a948b40c4.png',
+        active: 'https://img.yzcdn.cn/public_files/2017/10/13/793c77793db8641c4c325b7f25bf130d.png'
+      }
+    }
+  }
+}
+</script>
+
+
+<style lang="postcss">
+.demo-tabbar {
+  .van-tabbar {
+    position: relative;
+
+    &-item {
+      cursor: pointer;
+    }
+  }
+}
+</style>