Merge pull request #105 from Raistlin916/dev

PayOrder component add tip slot

docs/examples-docs/pay-order.md

@@ -7,6 +7,9 @@ export default {
   methods: {
     onClickButton() {
       Toast('点击按钮');
+    },
+    onClickEditAddress() {
+      Toast('修改地址');
     }
   }
 }
@@ -17,6 +20,9 @@ export default {
   .van-pay-order {
     position: relative;
   }
+  .van-edit-address {
+    color: #38F;
+  }
 }
 </style>
 
@@ -69,6 +75,22 @@ Vue.component(PayOrder.name, PayOrder);
 ```
 :::
 
+#### 
+提示文案中的额外操作和说明
+:::demo 提示文案中添加操作
+```html
+<van-pay-order
+  :price="3050"
+  button-text="提交订单"
+  @submit="onClickButton"
+>
+  <span slot="tip">
+    您的收货地址不支持同城送, <span class="van-edit-address" @click="onClickEditAddress">修改地址 ></span>
+  </span>
+</van-pay-order>
+```
+:::
+
 ### API
 
 | 参数       | 说明      | 类型       | 默认值       | 必须      |
@@ -85,3 +107,9 @@ Vue.component(PayOrder.name, PayOrder);
 | 事件名       | 说明      | 参数       |
 |-----------|-----------|-----------|
 | submit | 按钮点击事件回调 | - |
+
+### Slot
+
+| 名称      | 说明      |
+|-----------|-----------|
+| tip | 提示文案中的额外操作和说明 |

packages/pay-order/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="van-pay-order">
-    <div class="van-pay-order__tip" v-show="tip">{{ tip }}</div>
+    <div class="van-pay-order__tip" v-show="tip || hasTipSlot">{{ tip }}<slot name="tip" /></div>
     <div class="van-pay-order__bar">
       <div class="van-pay-order__price">
         <template v-if="hasPrice">
@@ -49,6 +49,9 @@ export default {
     priceDecimal() {
       const decimal = this.price % 100;
       return (decimal < 10 ? '0' : '') + decimal;
+    },
+    hasTipSlot () {
+      return !!this.$slots['tip']
     }
   },