[breaking change] Rename btn to button

README.md

@@ -59,12 +59,12 @@ npm run dev
 ```json
 {
     "usingComponents": {
-        "van-button": "/path/to/vant-weapp/dist/btn/index"
+        "van-button": "/path/to/vant-weapp/dist/button/index"
     }
 }
 ```
 ```html
-<!-- example/btn/index.html -->
+<!-- example/button/index.html -->
 
 <van-button>按钮</van-button>
 ```

dist/actionsheet/index.json

@@ -1,6 +1,6 @@
 {
   "component": true,
   "usingComponents": {
-    "van-btn": "../btn/index"
+    "van-button": "../button/index"
   }
 }

dist/actionsheet/index.wxml

@@ -5,17 +5,17 @@
   ></view>
   <view class="container-class van-actionsheet__container">
     <!-- 选项按钮 -->
-    <van-btn
+    <van-button
       wx:for="{{ actions }}"
       wx:key="{{ index }}-{{ item.name }}"
-      bind:btnclick="handleBtnClick"
+      bind:buttonclick="handleBtnClick"
       data-index="{{ index }}"
       open-type="{{ item.openType }}"
-      custom-class="van-actionsheet__btn"
+      custom-class="van-actionsheet__button"
       loading="{{ item.loading }}"
     >
       <!-- 自定义组件控制 slot 样式有问题，故在 slot 容器上传入 loading 信息 -->
-      <view class="van-actionsheet__btn-content {{ item.loading ? 'van-actionsheet__btn--loading' : '' }}">
+      <view class="van-actionsheet__button-content {{ item.loading ? 'van-actionsheet__button--loading' : '' }}">
         <view class="van-actionsheet__name">{{ item.name }}</view>
         <view
           wx:if="{{ item.subname }}"
@@ -23,17 +23,17 @@
           {{ item.subname }}
         </view>
       </view>
-    </van-btn>
+    </van-button>
 
     <!-- 关闭按钮 -->
     <view
       wx:if="{{ cancelText }}"
       class="van-actionsheet__footer"
     >
-      <van-btn
+      <van-button
-        custom-class="van-actionsheet__btn"
+        custom-class="van-actionsheet__button"
         catchtap="cancelClick"
-      >{{ cancelText }}</van-btn>
+      >{{ cancelText }}</van-button>
     </view>
   </view>
 </view>

dist/actionsheet/index.wxss

@@ -1 +1 @@
-.van-actionsheet{background-color:#f8f8f8}.van-actionsheet__mask{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10;background:rgba(0,0,0,.7);display:none}.van-actionsheet__container{position:fixed;left:0;right:0;bottom:0;background:#f8f8f8;-webkit-transform:translate3d(0,50%,0);transform:translate3d(0,50%,0);-webkit-transform-origin:center;transform-origin:center;-webkit-transition:all .2s ease;transition:all .2s ease;z-index:11;opacity:0;visibility:hidden}.van-actionsheet__btn{margin-bottom:0!important}.van-actionsheet__footer .van-actionsheet__btn{background:#fff}.van-actionsheet__btn-content{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-pack:center;justify-content:center}.van-actionsheet__subname{color:#999}.van-actionsheet__name,.van-actionsheet__subname{height:45px;line-height:45px}.van-actionsheet__btn.van-btn:last-child::after{border-bottom-width:0}.van-actionsheet__subname{margin-left:2px;font-size:12px}.van-actionsheet__footer{margin-top:10px}.van-actionsheet__btn--loading .van-actionsheet__subname{color:transparent}.van-actionsheet--show .van-actionsheet__container{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);visibility:visible}.van-actionsheet--show .van-actionsheet__mask{display:block}
+.van-actionsheet{background-color:#f8f8f8}.van-actionsheet__mask{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10;background:rgba(0,0,0,.7);display:none}.van-actionsheet__container{position:fixed;left:0;right:0;bottom:0;background:#f8f8f8;-webkit-transform:translate3d(0,50%,0);transform:translate3d(0,50%,0);-webkit-transform-origin:center;transform-origin:center;-webkit-transition:all .2s ease;transition:all .2s ease;z-index:11;opacity:0;visibility:hidden}.van-actionsheet__button{margin-bottom:0!important}.van-actionsheet__footer .van-actionsheet__button{background:#fff}.van-actionsheet__button-content{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-pack:center;justify-content:center}.van-actionsheet__subname{color:#999}.van-actionsheet__name,.van-actionsheet__subname{height:45px;line-height:45px}.van-actionsheet__button.van-button:last-child::after{border-bottom-width:0}.van-actionsheet__subname{margin-left:2px;font-size:12px}.van-actionsheet__footer{margin-top:10px}.van-actionsheet__button--loading .van-actionsheet__subname{color:transparent}.van-actionsheet--show .van-actionsheet__container{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);visibility:visible}.van-actionsheet--show .van-actionsheet__mask{display:block}

dist/btn-group/index.js

@@ -2,7 +2,7 @@
 
 Component({
   relations: {
-    '../btn/index': {
+    '../button/index': {
       type: 'child',
       linked: function linked() {
         updateBtnChild.call(this);
@@ -18,13 +18,13 @@ Component({
 });
 
 function updateBtnChild() {
-  var btns = this.getRelationNodes('../btn/index');
+  var buttons = this.getRelationNodes('../button/index');
 
-  if (btns.length > 0) {
+  if (buttons.length > 0) {
-    var lastIndex = btns.length - 1;
+    var lastIndex = buttons.length - 1;
 
-    btns.forEach(function (btn, index) {
+    buttons.forEach(function (button, index) {
-      btn.switchLastButtonStatus(index === lastIndex);
+      button.switchLastButtonStatus(index === lastIndex);
     });
   }
 }

dist/btn-group/index.wxml

@@ -1,3 +1,3 @@
-<view class="btn-group">
+<view class="button-group">
   <slot></slot>
 </view>

dist/btn-group/index.wxss

@@ -1,3 +1,3 @@
-.btn-group {
+.button-group {
   margin: 15px;
 }

dist/btn/index.js

@@ -6,7 +6,7 @@ Component({
   externalClasses: ['custom-class', 'theme-class'],
   behaviors: [nativeButtonBehavior],
   relations: {
-    '../btn-group/index': {
+    '../button-group/index': {
       type: 'parent',
       linked: function linked() {
         this.setData({ inGroup: true });
@@ -50,7 +50,7 @@ Component({
         this.triggerEvent('disabledclick');
         return;
       }
-      this.triggerEvent('btnclick');
+      this.triggerEvent('buttonclick');
     },
     switchLastButtonStatus: function switchLastButtonStatus() {
       var isLast = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;

dist/btn/index.wxml

@@ -1,5 +1,5 @@
 <button
-  class="custom-class theme-class van-btn {{ inGroup ? 'van-btn--group' : '' }} {{ isLast ? 'van-btn--last' : '' }} {{size ? 'van-btn--'+size : ''}} {{size === 'mini' ? 'van-btn--plain' : ''}} {{plain ? 'van-btn--plain' : ''}} {{type ? 'van-btn--'+type : ''}} {{loading ? 'van-btn--loading' : ''}} {{disabled ? 'van-btn--disabled' : ''}}"
+  class="custom-class theme-class van-button {{ inGroup ? 'van-button--group' : '' }} {{ isLast ? 'van-button--last' : '' }} {{size ? 'van-button--'+size : ''}} {{size === 'mini' ? 'van-button--plain' : ''}} {{plain ? 'van-button--plain' : ''}} {{type ? 'van-button--'+type : ''}} {{loading ? 'van-button--loading' : ''}} {{disabled ? 'van-button--disabled' : ''}}"
   disabled="{{ disabled }}"
   hover-class="button-hover"
   open-type="{{ openType }}"

dist/btn/index.wxss

@@ -1 +1 @@
-.van-btn{position:relative;color:#333;background-color:#fff;padding-left:15px;padding-right:15px;border-radius:2px;font-size:16px;line-height:45px;height:45px;box-sizing:border-box;text-decoration:none;text-align:center;vertical-align:middle;overflow:visible}.van-btn--group{margin-bottom:10px}.van-btn::after{content:'';position:absolute;top:0;left:0;width:200%;height:200%;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:0 0;transform-origin:0 0;pointer-events:none;box-sizing:border-box;border:0 solid #e5e5e5;border-width:1px;border-radius:4px}.van-btn--primary{color:#fff;background-color:#4b0}.van-btn--primary::after{border-color:#0a0}.van-btn--warn{color:#fff;background-color:#f85}.van-btn--warn::after{border-color:#f85}.van-btn--danger{color:#fff;background-color:#f44}.van-btn--danger::after{border-color:#e33}.van-btn--small{display:inline-block;height:30px;line-height:30px;font-size:12px}.van-btn--small.van-btn--group{margin-bottom:0;margin-right:5px}.van-btn--mini{display:inline-block;line-height:21px;height:22px;font-size:10px;padding-left:5px;padding-right:5px}.van-btn--mini.van-btn--group{margin-bottom:0;margin-right:5px}.van-btn--large{border-radius:0;border:none;line-height:50px;height:50px}.van-btn--large.van-btn--group{margin-bottom:0}.van-btn--plain.van-btn{background-color:transparent}.van-btn--plain.van-btn--primary{color:#06bf04}.van-btn--plain.van-btn--warn{color:#f60}.van-btn--plain.van-btn--danger{color:#f44}.button-hover{opacity:.9}.van-btn--loading{color:transparent;opacity:1}.van-btn--loading::before{position:absolute;left:50%;top:50%;content:' ';width:16px;height:16px;margin-left:-8px;margin-top:-8px;border:3px solid #e5e5e5;border-color:#666 #e5e5e5 #e5e5e5 #e5e5e5;border-radius:8px;box-sizing:border-box;-webkit-animation:btn-spin .6s linear;animation:btn-spin .6s linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.van-btn--danger.van-btn--loading::before,.van-btn--primary.van-btn--loading::before,.van-btn--warn.van-btn--loading::before{border-color:#fff rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.1)}@-webkit-keyframes btn-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes btn-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.van-btn.van-btn--disabled{color:#999!important;background:#f8f8f8!important;border-color:#e5e5e5!important;cursor:not-allowed!important;opacity:1!important}.van-btn.van-btn--disabled::after{border-color:#e5e5e5!important}.van-btn--group.van-btn--last{margin-bottom:0;margin-right:0}
+.van-button{position:relative;color:#333;background-color:#fff;padding-left:15px;padding-right:15px;border-radius:2px;font-size:16px;line-height:45px;height:45px;box-sizing:border-box;text-decoration:none;text-align:center;vertical-align:middle;overflow:visible}.van-button--group{margin-bottom:10px}.van-button::after{content:'';position:absolute;top:0;left:0;width:200%;height:200%;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:0 0;transform-origin:0 0;pointer-events:none;box-sizing:border-box;border:0 solid #e5e5e5;border-width:1px;border-radius:4px}.van-button--primary{color:#fff;background-color:#4b0}.van-button--primary::after{border-color:#0a0}.van-button--warn{color:#fff;background-color:#f85}.van-button--warn::after{border-color:#f85}.van-button--danger{color:#fff;background-color:#f44}.van-button--danger::after{border-color:#e33}.van-button--small{display:inline-block;height:30px;line-height:30px;font-size:12px}.van-button--small.van-button--group{margin-bottom:0;margin-right:5px}.van-button--mini{display:inline-block;line-height:21px;height:22px;font-size:10px;padding-left:5px;padding-right:5px}.van-button--mini.van-button--group{margin-bottom:0;margin-right:5px}.van-button--large{border-radius:0;border:none;line-height:50px;height:50px}.van-button--large.van-button--group{margin-bottom:0}.van-button--plain.van-button{background-color:transparent}.van-button--plain.van-button--primary{color:#06bf04}.van-button--plain.van-button--warn{color:#f60}.van-button--plain.van-button--danger{color:#f44}.button-hover{opacity:.9}.van-button--loading{color:transparent;opacity:1}.van-button--loading::before{position:absolute;left:50%;top:50%;content:' ';width:16px;height:16px;margin-left:-8px;margin-top:-8px;border:3px solid #e5e5e5;border-color:#666 #e5e5e5 #e5e5e5 #e5e5e5;border-radius:8px;box-sizing:border-box;-webkit-animation:button-spin .6s linear;animation:button-spin .6s linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.van-button--danger.van-button--loading::before,.van-button--primary.van-button--loading::before,.van-button--warn.van-button--loading::before{border-color:#fff rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.1)}@-webkit-keyframes button-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes button-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.van-button.van-button--disabled{color:#999!important;background:#f8f8f8!important;border-color:#e5e5e5!important;cursor:not-allowed!important;opacity:1!important}.van-button.van-button--disabled::after{border-color:#e5e5e5!important}.van-button--group.van-button--last{margin-bottom:0;margin-right:0}

dist/dialog/dialog.js

@@ -18,7 +18,7 @@ function getParsedOptions() {
   var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
 
   return Object.assign({
-    // 自定义 btn 列表
+    // 自定义 button 列表
     // { type: 按钮类型，回调时以此作为区分依据，text: 按钮文案, color: 按钮文字颜色 }
     buttons: []
   }, defaultData, options);

dist/dialog/index.js

@@ -9,7 +9,7 @@ Component({
   data: {
     // 标题
     title: '',
-    // 自定义 btn 列表
+    // 自定义 button 列表
     // { type: 按钮类型，回调时以此作为区分依据，text: 按钮文案, color: 按钮文字颜色, openType: 微信开放能力 }
     buttons: [],
     // 内容

dist/dialog/index.json

@@ -2,6 +2,6 @@
   "component": true,
   "usingComponents": {
     "pop-manager": "../common/pop-manager/index",
-    "van-button": "../btn/index"
+    "van-button": "../button/index"
   } 
 }

dist/dialog/index.wxml

@@ -25,7 +25,7 @@
           data-type="{{ item.type }}"
           data-open-type="{{ item.openType }}"
           open-type="{{ item.openType }}"
-          bind:btnclick="handleButtonClick"
+          bind:buttonclick="handleButtonClick"
           bind:getuserinfo="handleUserInfoResponse"
           bind:getphonenumber="handlePhoneResponse"
           bind:opensetting="handleOpenSettingResponse"

doc.config.js

@@ -35,7 +35,7 @@ module.exports = {
         label: '基础',
         include: {
           icon: require('./packages/icon/README.md'),
-          btn: require('./packages/btn/README.md'),
+          button: require('./packages/button/README.md'),
           helper: require('./packages/helper/README.md'),
           loading: require('./packages/loading/README.md')
         }

example/app.json

@@ -2,7 +2,7 @@
   "pages": [
     "pages/dashboard/index",
     "pages/actionsheet/index",
-    "pages/btn/index",
+    "pages/button/index",
     "pages/checkbox/index",
     "pages/badge/index",
     "pages/capsule/index",

example/pages/actionsheet/index.json

@@ -2,7 +2,7 @@
   "navigationBarTitleText": "Actionsheet 上拉菜单",
   "usingComponents": {
     "van-actionsheet": "../../dist/actionsheet/index",
-    "van-button": "../../dist/btn/index",
+    "van-button": "../../dist/button/index",
     "doc-page": "../../components/doc-page/index"
   }
 }

example/pages/actionsheet/index.wxml

@@ -1,7 +1,7 @@
 
 <doc-page title="ACTIONSHEET">
-  <view class="van-btns" style="margin-top: 30vh;">
+  <view class="van-buttons" style="margin-top: 30vh;">
-    <van-button bind:btnclick="openActionsheet">
+    <van-button bind:buttonclick="openActionsheet">
       Actionsheet
     </van-button>
   </view>

example/pages/button/index.json

@@ -1,8 +1,8 @@
 {
   "navigationBarTitleText": "Button 按钮",
   "usingComponents": {
-    "van-button": "../../dist/btn/index",
+    "van-button": "../../dist/button/index",
-    "van-button-group": "../../dist/btn-group/index",
+    "van-button-group": "../../dist/button-group/index",
     "van-panel": "../../dist/panel/index",
     "doc-page": "../../components/doc-page/index"
   }

example/pages/dashboard/config.js

@@ -7,7 +7,7 @@ export default {
         path: '/pages/badge/index'
       }, {
         name: 'Button 按钮',
-        path: '/pages/btn/index'
+        path: '/pages/button/index'
       }, {
         name: 'Capsule 胶囊',
         path: '/pages/capsule/index'

example/pages/dialog/index.json

@@ -3,8 +3,8 @@
   "usingComponents": {
     "doc-page": "../../components/doc-page/index",
     "van-dialog": "../../dist/dialog/index",
-    "van-button": "../../dist/btn/index",
+    "van-button": "../../dist/button/index",
-    "van-button-group": "../../dist/btn-group/index",
+    "van-button-group": "../../dist/button-group/index",
     "van-toast": "../../dist/toast/index"
   }  
 }

example/pages/field/index.json

@@ -1,8 +1,8 @@
 {
   "navigationBarTitleText": "Field 输入框",
   "usingComponents": {
-    "van-button": "../../dist/btn/index",
+    "van-button": "../../dist/button/index",
-    "van-button-group": "../../dist/btn-group/index",
+    "van-button-group": "../../dist/button-group/index",
     "van-cell-group": "../../dist/cell-group/index",
     "van-field": "../../dist/field/index",
     "van-panel": "../../dist/panel/index",

example/pages/field/index.wxml

@@ -33,7 +33,7 @@
   </van-panel>
   
   <van-button-group>
-    <van-button type="primary" bind:btnclick="clearInput">清除输入</van-button>
+    <van-button type="primary" bind:buttonclick="clearInput">清除输入</van-button>
   </van-button-group>
 
   <!-- 去除标题后的输入框样式 -->
@@ -46,7 +46,7 @@
   </van-panel>
 
   <van-button-group>
-    <van-button type="primary" bind:btnclick="clearTextarea">清除输入</van-button>
+    <van-button type="primary" bind:buttonclick="clearTextarea">清除输入</van-button>
   </van-button-group>
 
   <!-- 使用 Field 圆角样式 -->

example/pages/popup/index.json

@@ -3,8 +3,8 @@
   "usingComponents": {
     "doc-page": "../../components/doc-page/index",
     "van-popup": "../../dist/popup/index",
-    "van-button": "../../dist/btn/index",
+    "van-button": "../../dist/button/index",
-    "van-button-group": "../../dist/btn-group/index"
+    "van-button-group": "../../dist/button-group/index"
   }  
 }
 

example/pages/popup/index.wxml

@@ -1,18 +1,18 @@
 <doc-page title="POPUP">
   <van-button-group style="margin-top: 10vh;display: block;">
-    <van-button class="van-btn" bind:btnclick="togglePopup">
+    <van-button class="van-button" bind:buttonclick="togglePopup">
       弹出popup
     </van-button>
-    <van-button class="van-btn" bind:btnclick="toggleTopPopup">
+    <van-button class="van-button" bind:buttonclick="toggleTopPopup">
       从顶部弹出popup
     </van-button>
-    <van-button class="van-btn" bind:btnclick="toggleBottomPopup">
+    <van-button class="van-button" bind:buttonclick="toggleBottomPopup">
       从底部弹出popup
     </van-button>
-    <van-button class="van-btn" bind:btnclick="toggleLeftPopup">
+    <van-button class="van-button" bind:buttonclick="toggleLeftPopup">
       从左边弹出popup
     </van-button>
-    <van-button class="van-btn" bind:btnclick="toggleRightPopup">
+    <van-button class="van-button" bind:buttonclick="toggleRightPopup">
       从右边弹出popup
     </van-button>
   </van-button-group>
@@ -23,8 +23,8 @@
     bindclose="togglePopup"
   >
     <view class="pop-example__container">
-      <view class="van-btns"> 
+      <view class="van-buttons"> 
-        <button class="van-btn" bindtap="togglePopup">
+        <button class="van-button" bindtap="togglePopup">
           关闭 popup
         </button>
       </view>
@@ -38,8 +38,8 @@
     bindclose="toggleLeftPopup"
   >
     <view class="pop-example__container pop-example__container--left">
-      <view class="van-btns">
+      <view class="van-buttons">
-        <button class="van-btn" bindtap="toggleLeftPopup">
+        <button class="van-button" bindtap="toggleLeftPopup">
           关闭 popup
         </button>
       </view>
@@ -53,8 +53,8 @@
     bindclose="toggleRightPopup"
   >
     <view class="pop-example__container pop-example__container--right">
-      <view class="van-btns">
+      <view class="van-buttons">
-        <button class="van-btn" catchtap="toggleRightPopup">
+        <button class="van-button" catchtap="toggleRightPopup">
           关闭 popup
         </button>
       </view>
@@ -78,8 +78,8 @@
     bindclose="toggleBottomPopup"
   >
     <view class="pop-example__container pop-example__container--bottom">
-      <view class="van-btns">
+      <view class="van-buttons">
-        <button class="van-btn" catchtap="toggleBottomPopup">
+        <button class="van-button" catchtap="toggleBottomPopup">
           关闭 popup
         </button>
       </view>

example/pages/toast/index.json

@@ -1,8 +1,8 @@
 {
   "navigationBarTitleText": "Toast 轻提示",
   "usingComponents": {
-    "van-button": "../../dist/btn/index",
+    "van-button": "../../dist/button/index",
-    "van-button-group": "../../dist/btn-group/index",
+    "van-button-group": "../../dist/button-group/index",
     "van-toast": "../../dist/toast/index"
   }
 }

example/pages/toast/index.wxml

@@ -5,31 +5,31 @@
   <view class="doc-title van-hairline--bottom">TOAST</view>
 
   <van-button-group style="margin-top: 15vh;display: block;">
-    <van-button bind:btnclick="showToast">
+    <van-button bind:buttonclick="showToast">
       显示toast
     </van-button>
 
-    <van-button bind:btnclick="showIconToast">
+    <van-button bind:buttonclick="showIconToast">
       显示 Icon 图标的toast
     </van-button>
 
-    <van-button bind:btnclick="showImageToast">
+    <van-button bind:buttonclick="showImageToast">
       自定义图片作为图标的toast
     </van-button>
 
-    <van-button bind:btnclick="showLoadingToast">
+    <van-button bind:buttonclick="showLoadingToast">
       显示 Loading toast
     </van-button>
 
-    <van-button bind:btnclick="showOnlyIcon">
+    <van-button bind:buttonclick="showOnlyIcon">
       只显示图标的toast
     </van-button>
 
-    <van-button bind:btnclick="showEverToast">
+    <van-button bind:buttonclick="showEverToast">
       不消失的的toast
     </van-button>
 
-    <van-button bind:btnclick="showLoading">
+    <van-button bind:buttonclick="showLoading">
       显示 Loading
     </van-button>
   </van-button-group>

example/pages/toptips/index.json

@@ -1,7 +1,7 @@
 {
   "navigationBarTitleText": "Toptips 顶部提示",
   "usingComponents": {
-    "van-button": "../../dist/btn/index",
+    "van-button": "../../dist/button/index",
     "van-toptips": "../../dist/toptips/index",
     "doc-page": "../../components/doc-page/index"
   }

example/pages/toptips/index.wxml

@@ -1,18 +1,18 @@
 <doc-page title="TOPTIPS">
   <view style="margin-top: 30vh;">
-    <van-button bind:btnclick="showTopTips">
+    <van-button bind:buttonclick="showTopTips">
       显示toptips，声明式调用
     </van-button>
   </view>
 
   <view style="margin-top: 30px;">
-    <van-button bind:btnclick="showTopTips2">
+    <van-button bind:buttonclick="showTopTips2">
       显示toptips，命令式调用
     </van-button>
   </view>
 
   <view style="margin-top: 30px;">
-    <van-button bind:btnclick="showTopTips3">
+    <van-button bind:buttonclick="showTopTips3">
       显示toptips，持续一秒
     </van-button>
   </view>

packages/actionsheet/index.json

@@ -1,6 +1,6 @@
 {
   "component": true,
   "usingComponents": {
-    "van-btn": "../btn/index"
+    "van-button": "../button/index"
   }
 }

packages/actionsheet/index.pcss

@@ -30,15 +30,15 @@
   visibility: hidden;
 }
 
-.van-actionsheet__btn {
+.van-actionsheet__button {
   margin-bottom: 0 !important;
 }
 
-.van-actionsheet__footer .van-actionsheet__btn {
+.van-actionsheet__footer .van-actionsheet__button {
   background: #fff;
 }
 
-.van-actionsheet__btn-content {
+.van-actionsheet__button-content {
   display: flex;
   flex-direction: row;
   justify-content: center;
@@ -55,7 +55,7 @@
 }
 
 
-.van-actionsheet__btn.van-btn:last-child {
+.van-actionsheet__button.van-button:last-child {
   &::after {
     border-bottom-width: 0;
   }
@@ -70,8 +70,8 @@
   margin-top: 10px;
 }
 
-/* btn-loading 状态 */
+/* button-loading 状态 */
-.van-actionsheet__btn--loading .van-actionsheet__subname {
+.van-actionsheet__button--loading .van-actionsheet__subname {
   color: transparent;
 }
 

packages/actionsheet/index.wxml

@@ -5,17 +5,17 @@
   ></view>
   <view class="container-class van-actionsheet__container">
     <!-- 选项按钮 -->
-    <van-btn
+    <van-button
       wx:for="{{ actions }}"
       wx:key="{{ index }}-{{ item.name }}"
-      bind:btnclick="handleBtnClick"
+      bind:buttonclick="handleBtnClick"
       data-index="{{ index }}"
       open-type="{{ item.openType }}"
-      custom-class="van-actionsheet__btn"
+      custom-class="van-actionsheet__button"
       loading="{{ item.loading }}"
     >
       <!-- 自定义组件控制 slot 样式有问题，故在 slot 容器上传入 loading 信息 -->
-      <view class="van-actionsheet__btn-content {{ item.loading ? 'van-actionsheet__btn--loading' : '' }}">
+      <view class="van-actionsheet__button-content {{ item.loading ? 'van-actionsheet__button--loading' : '' }}">
         <view class="van-actionsheet__name">{{ item.name }}</view>
         <view
           wx:if="{{ item.subname }}"
@@ -23,17 +23,17 @@
           {{ item.subname }}
         </view>
       </view>
-    </van-btn>
+    </van-button>
 
     <!-- 关闭按钮 -->
     <view
       wx:if="{{ cancelText }}"
       class="van-actionsheet__footer"
     >
-      <van-btn
+      <van-button
-        custom-class="van-actionsheet__btn"
+        custom-class="van-actionsheet__button"
         catchtap="cancelClick"
-      >{{ cancelText }}</van-btn>
+      >{{ cancelText }}</van-button>
     </view>
   </view>
 </view>

packages/btn-group/index.wxml

@@ -1,3 +0,0 @@
-<view class="btn-group">
-  <slot></slot>
-</view>

packages/button-group/index.js

@@ -1,6 +1,6 @@
 Component({
   relations: {
-    '../btn/index': {
+    '../button/index': {
       type: 'child',
       linked() {
         updateBtnChild.call(this);
@@ -16,13 +16,13 @@ Component({
 });
 
 function updateBtnChild() {
-  let btns = this.getRelationNodes('../btn/index');
+  let buttons = this.getRelationNodes('../button/index');
 
-  if (btns.length > 0) {
+  if (buttons.length > 0) {
-    let lastIndex = btns.length - 1;
+    let lastIndex = buttons.length - 1;
 
-    btns.forEach((btn, index) => {
+    buttons.forEach((button, index) => {
-      btn.switchLastButtonStatus(index === lastIndex);
+      button.switchLastButtonStatus(index === lastIndex);
     });
   }
 }

packages/button-group/index.wxml

@@ -0,0 +1,3 @@
+<view class="button-group">
+  <slot></slot>
+</view>

packages/button-group/index.wxss

@@ -1,3 +1,3 @@
-.btn-group {
+.button-group {
   margin: 15px;
 }

packages/button/README.md

@@ -4,7 +4,7 @@
 在 json 文件中配置button组件
 ```json
 "usingComponents": {
-  "van-button": "path/to/vant-weapp/dist/btn/index"
+  "van-button": "path/to/vant-weapp/dist/button/index"
 }
 ```
 
@@ -53,8 +53,8 @@
 1.在 json 文件中配置 button-group 组件
 ```json
 "usingComponents": {
-  "van-button": "path/to/vant-weapp/dist/btn/index",
+  "van-button": "path/to/vant-weapp/dist/button/index",
-  "van-button-group": "path/to/vant-weapp/dist/btn-group/index"
+  "van-button-group": "path/to/vant-weapp/dist/button-group/index"
 }
 ```
 2.在 wxml 中直接引入
@@ -90,7 +90,7 @@
 ### 事件
 | 事件名称       | 说明      | 回调参数       |
 |-----------|-----------|-----------|
-|  btnclick  | 按钮在可用状态被点击时触发 | |
+|  buttonclick  | 按钮在可用状态被点击时触发 | |
 |  disabledclick  | 在传入的 disabled 为 true 时，点击按钮会触发此事件 | |
 |  getuserinfo  | 用户点击该按钮时，会返回获取到的用户信息，从返回参数的detail中获取到的值同wx.getUserInfo | |
 |  contact  | 客服消息回调 | |

packages/button/index.js

@@ -4,7 +4,7 @@ Component({
   externalClasses: ['custom-class', 'theme-class'],
   behaviors: [nativeButtonBehavior],
   relations: {
-    '../btn-group/index': {
+    '../button-group/index': {
       type: 'parent',
       linked() {
         this.setData({ inGroup: true });
@@ -45,10 +45,10 @@ Component({
   methods: {
     handleTap() {
       if (this.data.disabled) {
-        this.triggerEvent('disabledclick')
+        this.triggerEvent('disabledclick');
         return;
       }
-      this.triggerEvent('btnclick');
+      this.triggerEvent('buttonclick');
     },
 
     switchLastButtonStatus(isLast = false) {

packages/button/index.pcss

@@ -1,6 +1,6 @@
 @import "../common/_mixins";
 
-.van-btn {
+.van-button {
   position: relative;
   color: #333;
   background-color: #fff;
@@ -17,18 +17,18 @@
   overflow: visible;
 }
 
-.van-btn--group {
+.van-button--group {
   margin-bottom: 10px;
 }
 
-.van-btn::after {
+.van-button::after {
   @mixin hairline;
   border-width: 1px;
   border-radius: 4px;
 }
 
 /* type */
-.van-btn--primary {
+.van-button--primary {
   color: #fff;
   background-color: #4b0;
 
@@ -37,7 +37,7 @@
   }
 }
 
-.van-btn--warn {
+.van-button--warn {
   color: #fff;
   background-color: #f85;
 
@@ -46,7 +46,7 @@
   }
 }
 
-.van-btn--danger {
+.van-button--danger {
   color: #fff;
   background-color: #f44;
 
@@ -56,19 +56,19 @@
 }
 
 /* size */
-.van-btn--small {
+.van-button--small {
   display: inline-block;
   height: 30px;
   line-height: 30px;
   font-size: 12px;
   /* margin-right: 5px; */
 }
-.van-btn--small.van-btn--group {
+.van-button--small.van-button--group {
   margin-bottom: 0;
   margin-right: 5px;
 }
 
-.van-btn--mini {
+.van-button--mini {
   display: inline-block;
   line-height: 21px;
   height: 22px;
@@ -77,32 +77,32 @@
   padding-left: 5px;
   padding-right: 5px;
 }
-.van-btn--mini.van-btn--group {
+.van-button--mini.van-button--group {
   margin-bottom: 0;
   margin-right: 5px;
 }
 
-.van-btn--large {
+.van-button--large {
   border-radius: 0;
   border: none;
   line-height: 50px;
   height: 50px;
 }
-.van-btn--large.van-btn--group {
+.van-button--large.van-button--group {
   margin-bottom: 0;
 }
 
 /* plain */
-.van-btn--plain.van-btn {
+.van-button--plain.van-button {
   background-color: transparent;
 }
-.van-btn--plain.van-btn--primary {
+.van-button--plain.van-button--primary {
   color: #06BF04;
 }
-.van-btn--plain.van-btn--warn {
+.van-button--plain.van-button--warn {
   color: #FF6600;
 }
-.van-btn--plain.van-btn--danger {
+.van-button--plain.van-button--danger {
   color: #FF4444;
 }
 
@@ -112,11 +112,11 @@
 }
 
 /* loading */
-.van-btn--loading {
+.van-button--loading {
   color: transparent;
   opacity: 1;
 }
-.van-btn--loading::before {
+.van-button--loading::before {
   position: absolute;
   left: 50%;
   top: 50%;
@@ -129,16 +129,16 @@
   border-color: #666 #e5e5e5 #e5e5e5 #e5e5e5;
   border-radius: 8px;
   box-sizing: border-box;
-  animation: btn-spin 0.6s linear;
+  animation: button-spin 0.6s linear;
   animation-iteration-count: infinite;
 }
-.van-btn--primary.van-btn--loading::before,
+.van-button--primary.van-button--loading::before,
-.van-btn--warn.van-btn--loading::before,
+.van-button--warn.van-button--loading::before,
-.van-btn--danger.van-btn--loading::before {
+.van-button--danger.van-button--loading::before {
   border-color: #fff rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
 }
 
-@keyframes btn-spin {
+@keyframes button-spin {
   0% {
     transform: rotate(0);
   }
@@ -148,7 +148,7 @@
 }
 
 /* disabled */
-.van-btn.van-btn--disabled {
+.van-button.van-button--disabled {
   /* 防止样式被 button[disabled] 的规则覆盖，所以使用了important */
   color: #999 ! important;
   background: #f8f8f8 ! important;
@@ -162,7 +162,7 @@
 }
 
 /* :last-child */
-.van-btn--group.van-btn--last {
+.van-button--group.van-button--last {
   margin-bottom: 0;
   margin-right: 0;
 }

packages/button/index.wxml

@@ -1,5 +1,5 @@
 <button
-  class="custom-class theme-class van-btn {{ inGroup ? 'van-btn--group' : '' }} {{ isLast ? 'van-btn--last' : '' }} {{size ? 'van-btn--'+size : ''}} {{size === 'mini' ? 'van-btn--plain' : ''}} {{plain ? 'van-btn--plain' : ''}} {{type ? 'van-btn--'+type : ''}} {{loading ? 'van-btn--loading' : ''}} {{disabled ? 'van-btn--disabled' : ''}}"
+  class="custom-class theme-class van-button {{ inGroup ? 'van-button--group' : '' }} {{ isLast ? 'van-button--last' : '' }} {{size ? 'van-button--'+size : ''}} {{size === 'mini' ? 'van-button--plain' : ''}} {{plain ? 'van-button--plain' : ''}} {{type ? 'van-button--'+type : ''}} {{loading ? 'van-button--loading' : ''}} {{disabled ? 'van-button--disabled' : ''}}"
   disabled="{{ disabled }}"
   hover-class="button-hover"
   open-type="{{ openType }}"

packages/button/native-button-behaviors.js

@@ -32,19 +32,24 @@ module.exports = Behavior({
     sendMessageImg: String,
     showMessageCard: String
   },
+
   methods: {
     bindgetuserinfo({ detail = {} } = {}) {
       this.triggerEvent('getuserinfo', detail);
     },
+
     bindcontact({ detail = {} } = {}) {
       this.triggerEvent('contact', detail);
     },
+
     bindgetphonenumber({ detail = {} } = {}) {
       this.triggerEvent('getphonenumber', detail);
     },
-    bindopensetting({ detail = {}} = {}) {
+
+    bindopensetting({ detail = {} } = {}) {
       this.triggerEvent('opensetting', detail);
     },
+
     binderror({ detail = {} } = {}) {
       this.triggerEvent('error', detail);
     }

packages/dialog/dialog.js

@@ -11,7 +11,7 @@ function getDialogCtx({ selector, pageCtx }) {
 
 function getParsedOptions(options = {}) {
   return {
-    // 自定义 btn 列表
+    // 自定义 button 列表
     // { type: 按钮类型，回调时以此作为区分依据，text: 按钮文案, color: 按钮文字颜色 }
     buttons: [],
     ...defaultData,

packages/dialog/index.js

@@ -7,7 +7,7 @@ Component({
   data: {
     // 标题
     title: '',
-    // 自定义 btn 列表
+    // 自定义 button 列表
     // { type: 按钮类型，回调时以此作为区分依据，text: 按钮文案, color: 按钮文字颜色, openType: 微信开放能力 }
     buttons: [],
     // 内容

packages/dialog/index.json

@@ -2,6 +2,6 @@
   "component": true,
   "usingComponents": {
     "pop-manager": "../common/pop-manager/index",
-    "van-button": "../btn/index"
+    "van-button": "../button/index"
   } 
 }

packages/dialog/index.wxml

@@ -25,7 +25,7 @@
           data-type="{{ item.type }}"
           data-open-type="{{ item.openType }}"
           open-type="{{ item.openType }}"
-          bind:btnclick="handleButtonClick"
+          bind:buttonclick="handleButtonClick"
           bind:getuserinfo="handleUserInfoResponse"
           bind:getphonenumber="handlePhoneResponse"
           bind:opensetting="handleOpenSettingResponse"