From 1ef5cfdfb9c1a5cd950a4a480768a487e8ae92a5 Mon Sep 17 00:00:00 2001 From: Yao Date: Tue, 26 Sep 2017 15:47:27 +0800 Subject: [PATCH 1/4] =?UTF-8?q?=E6=96=87=E6=A1=A3=E4=BC=98=E5=8C=96=20&&?= =?UTF-8?q?=20waterfall=20bug=E4=BF=AE=E5=A4=8D=20(#145)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/examples-docs/waterfall.md | 43 ++++++++++----------------------- packages/waterfall/directive.js | 2 +- 2 files changed, 14 insertions(+), 31 deletions(-) diff --git a/docs/examples-docs/waterfall.md b/docs/examples-docs/waterfall.md index 268b02449..00c2e406b 100644 --- a/docs/examples-docs/waterfall.md +++ b/docs/examples-docs/waterfall.md @@ -15,7 +15,7 @@ Waterfall.install(Vue); #### 局部注册 -如果你只是想在某个组件中使用`Waterfall`，你可以在对应组件中注册`Waterfall`指令，这样只能在你注册的组件中使用`Waterfall`： +如果你只是想在某个组件中使用`Waterfall`，可以在对应组件中注册`Waterfall`指令，这样只能在你注册的组件中使用`Waterfall`： ```js import { Waterfall } from 'vant'; @@ -34,7 +34,7 @@ export default { export default { data() { return { - list: [1, 2, 3, 4, 5], + list: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10], loading: false, finished: false }; @@ -54,7 +54,7 @@ export default { this.list.push(lastNumber); } this.loading = false; - }, 2000); + }, 200); } }, computed: { @@ -67,15 +67,16 @@ export default { #### 基础用法 - +使用 `v-waterfall-lower` 监听滚动到达底部，并执行相应函数。若是函数执行中需要异步加载数据，可以将 `waterfall-disabled` 指定的值置为 false，禁止 `v-waterfall-lower` 监听滚动事件 :::demo 基础用法 ```html

当即将滚动到元素底部时，会自动加载更多

-
-
-
- {{ item }} -
- -
-
+ ``` ::: diff --git a/packages/waterfall/directive.js b/packages/waterfall/directive.js index 220479d40..f10b536ee 100644 --- a/packages/waterfall/directive.js +++ b/packages/waterfall/directive.js @@ -42,7 +42,7 @@ function handleScrollEvent() { // 判断是否到了底 let needLoadMoreToLower = false; if (element === scrollEventTarget) { - needLoadMoreToLower = scrollEventTarget.scollHeight - targetBottom < this.offset; + needLoadMoreToLower = scrollEventTarget.scrollHeight - targetBottom < this.offset; } else { const elementBottom = Utils.getElementTop(element) - Utils.getElementTop(scrollEventTarget) + Utils.getVisibleHeight(element); needLoadMoreToLower = elementBottom - Utils.getVisibleHeight(scrollEventTarget) < this.offset; From be6331ad2150f6e413a3b976fda1d1e90ddba522 Mon Sep 17 00:00:00 2001 From: wny Date: Tue, 26 Sep 2017 07:11:59 -0500 Subject: [PATCH 2/4] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=8D=95=E7=8B=AC?= =?UTF-8?q?=E7=A6=81=E7=94=A8stepper=20input=E5=8A=9F=E8=83=BD=20(#146)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: sku message key * fix: 改用goods_id当key * fix: 漏改一处 * feat: 增加单独禁用stepper input功能 * fix: update doc * fix: rename spec file --- docs/examples-docs/sku.md | 7 +++++-- docs/examples-docs/stepper.md | 3 ++- packages/sku/components/SkuStepper.vue | 13 +++++++++++- packages/sku/containers/SkuContainer.vue | 2 ++ packages/stepper/index.vue | 14 +++++++++---- .../specs/{stepper.js => stepper.spec.js} | 20 ++++++++++++++++++- .../{submit-bar.js => submit-bar.spec.js} | 0 7 files changed, 50 insertions(+), 9 deletions(-) rename test/unit/specs/{stepper.js => stepper.spec.js} (85%) rename test/unit/specs/{submit-bar.js => submit-bar.spec.js} (100%) diff --git a/docs/examples-docs/sku.md b/docs/examples-docs/sku.md index e01db13ab..2eee8971f 100644 --- a/docs/examples-docs/sku.md +++ b/docs/examples-docs/sku.md @@ -16,6 +16,8 @@ export default { goodsId: data.goods_id, quota: data.quota, quotaUsed: data.quota_used, + disableStepperInput: true, + resetStepperOnHide: true, initialSku: { s1: '30349', s2: '1193' @@ -62,10 +64,10 @@ Vue.component(Sku.name, Sku); :goods="goods" :goods-id="goodsId" :hide-stock="sku.hide_stock" - :show-add-cart-btn="true" :quota="quota" :quota-used="quotaUsed" - :reset-stepper-on-hide="true" + :reset-stepper-on-hide="resetStepperOnHide" + :disable-stepper-input="disableStepperInput" @buy-clicked="handleBuyClicked" @add-cart="handleAddCartClicked" > @@ -130,6 +132,7 @@ Vue.component(Sku.name, Sku); | quota | 限购数(0表示不限购) | Number | 0 | 否 | | quotaUsed | 已经购买过的数量 | Number | 0 | 否 | | resetStepperOnHide | 窗口隐藏时重置选择的商品数量 | Boolean | false | 否 | +| disableStepperInput | 是否禁用sku中stepper的input框 | Boolean | false | 否 | | stepperTitle | 数量选择组件左侧文案 | String | '购买数量' | 否 | | add-cart | 点击添加购物车回调 | Function(skuData: Object) | - | 否 | | buy-clicked | 点击购买回调 | Function(skuData: Object) | - | 否 | diff --git a/docs/examples-docs/stepper.md b/docs/examples-docs/stepper.md index ce48e7804..19cee1d97 100644 --- a/docs/examples-docs/stepper.md +++ b/docs/examples-docs/stepper.md @@ -69,7 +69,8 @@ Vue.component(Stepper.name, Stepper); | max | 最大值 | `String | Number` | - | - | | defaultValue | 默认值 | `String | Number` | `1` | - | | step | 步数 | `String | Number` | `1` | - | -| disabled | 是否禁用 | `Boolean` | `false` | - | +| disabled | 是否禁用 | `Boolean` | `false` | - | +| disableInput | 是否禁用input框 | `Boolean` | `false` | - | ### Event diff --git a/packages/sku/components/SkuStepper.vue b/packages/sku/components/SkuStepper.vue index 892c235f9..c15be326f 100644 --- a/packages/sku/components/SkuStepper.vue +++ b/packages/sku/components/SkuStepper.vue @@ -2,7 +2,14 @@
{{ stepperTitle }}：
- + +
剩余{{ stock }}件
每人限购{{ quota }}件
@@ -34,6 +41,10 @@ export default { type: Boolean, default: false }, + disableStepperInput: { + type: Boolean, + default: false + }, stepperTitle: { type: String, default: DEFAULT_BUY_TEXT diff --git a/packages/sku/containers/SkuContainer.vue b/packages/sku/containers/SkuContainer.vue index 2d36faa0a..b79a0c3f2 100644 --- a/packages/sku/containers/SkuContainer.vue +++ b/packages/sku/containers/SkuContainer.vue @@ -45,6 +45,7 @@ :skuStockNum="sku.stock_num" :quota="quota" :quotaUsed="quotaUsed" + :disableStepperInput="disableStepperInput" :hideStock="hideStock"> @@ -133,6 +134,7 @@ export default { default: 200 }, resetStepperOnHide: Boolean, + disableStepperInput: Boolean, messagePlaceholderMap: { type: Object, default() { diff --git a/packages/stepper/index.vue b/packages/stepper/index.vue index adc61b2e4..cf8bb9a78 100644 --- a/packages/stepper/index.vue +++ b/packages/stepper/index.vue @@ -8,11 +8,11 @@ }"> + :disabled="disabled || disableInput">