diff --git a/src/button/README.md b/src/button/README.md
index 9063094b8..da1073d2c 100644
--- a/src/button/README.md
+++ b/src/button/README.md
@@ -97,7 +97,7 @@ Vue.use(Button);
| type | Can be set to `primary` `info` `warning` `danger` | `string` | `default` |
| size | Can be set to `large` `small` `mini` | `string` | `normal` |
| text | Text | `string` | - |
-| color | Color | `string` | - |
+| color | Color, support linear-gradient | `string` | - |
| icon | Left Icon | `string` | - |
| tag | HTML Tag | `string` | `button` |
| native-type | Native Type Attribute | `string` | `''` |
diff --git a/src/button/README.zh-CN.md b/src/button/README.zh-CN.md
index 499c47521..a2e15e318 100644
--- a/src/button/README.zh-CN.md
+++ b/src/button/README.zh-CN.md
@@ -117,7 +117,7 @@ Vue.use(Button);
| type | 类型，可选值为 `primary` `info` `warning` `danger` | `string` | `default` | 1.6.6 |
| size | 尺寸，可选值为 `large` `small` `mini` | `string` | `normal` | - |
| text | 按钮文字 | `string` | - | - |
-| color | 按钮颜色 | `string` | - | 2.1.3 |
+| color | 按钮颜色，支持传入`linear-gradient`渐变色 | `string` | - | 2.1.3 |
| icon | 左侧图标名称或图片链接，可选值见 Icon 组件 | `string` | - | 2.0.0 |
| tag | HTML 标签 | `string` | `button` | - |
| native-type | 原生 button 标签 type 属性 | `string` | - | - |
diff --git a/src/goods-action-button/index.js b/src/goods-action-button/index.js
index 470f6632c..adda27524 100644
--- a/src/goods-action-button/index.js
+++ b/src/goods-action-button/index.js
@@ -12,6 +12,7 @@ export default createComponent({
...routeProps,
type: String,
text: String,
+ color: String,
loading: Boolean,
disabled: Boolean
},
@@ -48,6 +49,7 @@ export default createComponent({
square
size="large"
type={this.type}
+ color={this.color}
loading={this.loading}
disabled={this.disabled}
onClick={this.onClick}
diff --git a/src/goods-action/README.md b/src/goods-action/README.md
index e99290b85..8fdccd34b 100644
--- a/src/goods-action/README.md
+++ b/src/goods-action/README.md
@@ -22,26 +22,10 @@ Vue
```html
-
-
-
-
+
+
+
+
```
@@ -64,27 +48,22 @@ Use `info` prop to show messages in upper right corner of icon
```html
-
-
-
-
-
+
+
+
+
+
+
+```
+
+### Custom Button Color
+
+```html
+
+
+
+
+
```
@@ -114,6 +93,7 @@ Use `info` prop to show messages in upper right corner of icon
|------|------|------|------|
| type | Button type, Can be set to `primary` `info` `warning` `danger` | `string` | `default` |
| text | Button text | `string` | - |
+| color | Button color, support linear-gradient | `string` | - |
| primary | Is primary button (red color) | `boolean` | `false` |
| disabled | Whether to disable button | `boolean` | `false` |
| loading | Whether show loading status | `boolean` | `false` |
diff --git a/src/goods-action/README.zh-CN.md b/src/goods-action/README.zh-CN.md
index 13b22adf3..c96d88649 100644
--- a/src/goods-action/README.zh-CN.md
+++ b/src/goods-action/README.zh-CN.md
@@ -22,26 +22,10 @@ Vue
```html
-
-
-
-
+
+
+
+
```
@@ -64,27 +48,24 @@ export default {
```html
-
-
-
-
-
+
+
+
+
+
+
+```
+
+### 自定义按钮颜色
+
+通过`color`属性可以自定义按钮的颜色，支持传入`linear-gradient`渐变色
+
+```html
+
+
+
+
+
```
@@ -114,6 +95,7 @@ export default {
|------|------|------|------|------|
| text | 按钮文字 | `string` | - | - |
| type | 按钮类型，可选值为 `primary` `info` `warning` `danger` | `string` | `default` | 2.0.0 |
+| color | 按钮颜色，支持传入`linear-gradient`渐变色 | `string` | - | 2.1.8 |
| disabled | 是否禁用按钮 | `boolean` | `false` | - | - |
| loading | 是否显示为加载状态 | `boolean` | `false` | - | - |
| url | 跳转链接 | `string` | - | - |
diff --git a/src/goods-action/demo/index.vue b/src/goods-action/demo/index.vue
index ec6e3ed54..16faedc8f 100644
--- a/src/goods-action/demo/index.vue
+++ b/src/goods-action/demo/index.vue
@@ -3,57 +3,29 @@
-
-
-
-
+
+
+
+
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -70,7 +42,8 @@ export default {
icon3: '店铺',
button1: '加入购物车',
button2: '立即购买',
- title2: '图标提示'
+ title2: '图标提示',
+ customButtonColor: '自定义按钮颜色'
},
'en-US': {
clickIcon: 'Click Icon',
@@ -80,7 +53,8 @@ export default {
icon3: 'Icon3',
button1: 'Button1',
button2: 'Button2',
- title2: 'Icon info'
+ title2: 'Icon info',
+ customButtonColor: 'Custom Button Color'
}
},
methods: {
diff --git a/src/goods-action/test/__snapshots__/demo.spec.js.snap b/src/goods-action/test/__snapshots__/demo.spec.js.snap
index 1dfc42768..f89a54791 100644
--- a/src/goods-action/test/__snapshots__/demo.spec.js.snap
+++ b/src/goods-action/test/__snapshots__/demo.spec.js.snap
@@ -35,5 +35,19 @@ exports[`renders demo correctly 1`] = `
+
`;