From 5591d44bdaa0b8df82a4dc5571020eb19ddacf13 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@buaa.edu.cn>
Date: Sun, 17 Feb 2019 20:47:04 +0800
Subject: [PATCH] =?UTF-8?q?[new=20feature]=20Tabs:=20add=20title-active-co?=
 =?UTF-8?q?lor=E3=80=81title-inactive-color=20prop=20(#2773)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/tab/en-US.md  | 4 +++-
 packages/tab/zh-CN.md  | 4 +++-
 packages/tabs/index.js | 8 ++++++++
 3 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/tab/en-US.md b/packages/tab/en-US.md
index dac4136e6..e3ce42671 100644
--- a/packages/tab/en-US.md
+++ b/packages/tab/en-US.md
@@ -151,12 +151,14 @@ In swipeable mode, you can switch tabs with swipe gestrue in the content
 | Attribute | Description | Type | Default |
 |------|------|------|------|
 | v-model | Index of active tab | `String` `Number` | `0` |
-| color | Tab color | `String` | `#f44` |
 | type | Can be set to `line` `card` | `String` | `line` |
 | duration | Toggle tab's animation time | `Number` | `0.3` | - |
 | background | Background color | `String` | `white` |
 | line-width | Width of tab line (px) | `Number` | Width of active tab |
 | line-height | Height of tab line (px) | `Number` | 3 |
+| color | Tab color | `String` | `#f44` |
+| title-active-color | Title active color | `String` | - |
+| title-inactive-color | Title inactive color | `String` | - |
 | swipe-threshold | Set swipe tabs threshold | `Number` | `4` | - |
 | sticky | Whether to use sticky mode | `Boolean` | `false` |
 | offset-top | Offset top when use sticky mode | `Number` | `0` |
diff --git a/packages/tab/zh-CN.md b/packages/tab/zh-CN.md
index b1ac35136..38e66a87d 100644
--- a/packages/tab/zh-CN.md
+++ b/packages/tab/zh-CN.md
@@ -155,12 +155,14 @@ export default {
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 |------|------|------|------|------|
 | v-model | 当前标签的索引 | `String` `Number` | `0` | 1.0.6 |
-| color | 标签颜色 | `String` | `#f44` | 1.2.0 |
 | type | 样式类型，可选值为`card` | `String` | `line` | - |
 | duration | 动画时间，单位秒 | `Number` | `0.3` | - |
 | background | 标签栏背景色 | `String` | `white` | 1.6.5 |
 | line-width | 底部条宽度，单位 px | `Number` | - | 1.1.1 |
 | line-height | 底部条高度，单位 px | `Number` | 3 | 1.5.0 |
+| color | 标签主题色 | `String` | `#f44` | 1.2.0 |
+| title-active-color | 标题选中态颜色 | `String` | - | 1.6.5 |
+| title-inactive-color | 标题默认态颜色 | `String` | - | 1.6.5 |
 | swipeable | 是否开启手势滑动切换 | `Boolean` | `false` | 1.0.0 |
 | sticky | 是否使用粘性定位布局 | `Boolean` | `false` | - |
 | offset-top | 粘性定位布局下与顶部的最小距离，单位 px | `Number` | `0` | 1.1.15 |
diff --git a/packages/tabs/index.js b/packages/tabs/index.js
index c210a12e8..5e5ed2db8 100644
--- a/packages/tabs/index.js
+++ b/packages/tabs/index.js
@@ -21,6 +21,8 @@ export default sfc({
     offsetTop: Number,
     swipeable: Boolean,
     background: String,
+    titleActiveColor: String,
+    titleInactiveColor: String,
     ellipsis: {
       type: Boolean,
       default: true
@@ -362,6 +364,7 @@ export default sfc({
       const active = index === this.curActive;
       const isCard = this.type === 'card';
 
+      // theme color
       if (color) {
         if (!item.disabled && isCard && !active) {
           style.color = color;
@@ -374,6 +377,11 @@ export default sfc({
         }
       }
 
+      const titleColor = active ? this.titleActiveColor : this.titleInactiveColor;
+      if (titleColor) {
+        style.color = titleColor;
+      }
+
       if (this.scrollable && this.ellipsis) {
         style.flexBasis = 88 / this.swipeThreshold + '%';
       }