[Improvement] Button: add square prop (#427)

packages/button/README.md

@@ -63,6 +63,7 @@
 | disabled | 是否禁用 | `Boolean` | `false` |
 | loading | 是否显示为加载状态 | `Boolean` | `false` |
 | block | 是否为块级元素 | `Boolean` | `false` |
+| square | 是否为方形按钮 | `Boolean` | `false` |
 | open-type | 微信开放能力 | `String` | - |
 | app-parameter | 打开 APP 时，向 APP 传递的参数 | `String` | - |
 | hover-start-time | 按住后多久出现点击态，单位毫秒 | `Number` | 20 |

packages/button/index.js

@@ -36,6 +36,10 @@ Component({
     block: {
       type: Boolean,
       observer
+    },
+    square: {
+      type: Boolean,
+      observer
     }
   },
 
@@ -51,11 +55,12 @@ Component({
     },
 
     setClasses() {
-      const { type, size, plain, disabled, loading, block } = this.data;
+      const { type, size, plain, disabled, loading, square, block } = this.data;
       this.setData({
         classes: classnames(`van-button--${type}`, `van-button--${size}`, {
           'van-button--block': block,
           'van-button--plain': plain,
+          'van-button--square': square,
           'van-button--loading': loading,
           'van-button--disabled': disabled,
           'van-button--unclickable': disabled || loading

packages/button/index.pcss

@@ -124,6 +124,10 @@
     display: block;
   }
 
+  &--square {
+    border-radius: 0;
+  }
+
   &--disabled {
     color: $button-disabled-color;
     background-color: $button-disabled-background-color;