diff --git a/docs/demos/views/sku.vue b/docs/demos/views/sku.vue index a930134fd..97bc35520 100644 --- a/docs/demos/views/sku.vue +++ b/docs/demos/views/sku.vue @@ -13,8 +13,8 @@ :reset-stepper-on-hide="true" :reset-selected-sku-on-hide="true" :disable-stepper-input="true" - @buy-clicked="handleBuyClicked" - @add-cart="handleAddCartClicked" + @buy-clicked="onBuyClicked" + @add-cart="onAddCartClicked" /> {{ $t('basicUsage') }} @@ -23,7 +23,7 @@ - - {{ $t('button1') }} + {{ $t('button1') }} {{ $t('button2') }} - {{ $t('advancedUsage') }} + {{ $t('advancedUsage') }} @@ -73,7 +72,7 @@ export default { data() { return { showBase: false, - showCustomAction: false, + showCustom: false, initialSku: { s1: '30349', s2: '1193' @@ -82,13 +81,15 @@ export default { }, methods: { - handleBuyClicked(data) { + onBuyClicked(data) { Toast(JSON.stringify(data)); }, - handleAddCartClicked(data) { + + onAddCartClicked(data) { Toast(JSON.stringify(data)); }, - handlePointClicked() { + + onPointClicked() { Toast('积分兑换'); } } diff --git a/docs/markdown/en-US/sku.md b/docs/markdown/en-US/sku.md index 41945a0ad..bef63dc4d 100644 --- a/docs/markdown/en-US/sku.md +++ b/docs/markdown/en-US/sku.md @@ -22,8 +22,8 @@ Vue.use(Sku); :reset-stepper-on-hide="resetStepperOnHide" :reset-selected-sku-on-hide="resetSelectedSkuOnHide" :disable-stepper-input="disableStepperInput" - @buy-clicked="handleBuyClicked" - @add-cart="handleAddCartClicked" + @buy-clicked="onBuyClicked" + @add-cart="onAddCartClicked" /> ``` @@ -42,15 +42,13 @@ Vue.use(Sku); :quota-used="quotaUsed" :reset-stepper-on-hide="true" :initial-sku="initialSku" - @buy-clicked="handleBuyClicked" - @add-cart="handleAddCartClicked" + @buy-clicked="onBuyClicked" + @add-cart="onAddCartClicked" > - - - Button + Button Button @@ -82,6 +80,12 @@ Vue.use(Sku); | add-cart | Triggered when click cart button | data: Object | | buy-clicked | Triggered when click buy button | data: Object | +### Methods + +| Method | Description | +|-----------|-----------| +| getSkuData() | Get current sku data | + ### Slot | Name | Description | diff --git a/docs/markdown/zh-CN/sku.md b/docs/markdown/zh-CN/sku.md index 57c0895ef..d8e555ec4 100644 --- a/docs/markdown/zh-CN/sku.md +++ b/docs/markdown/zh-CN/sku.md @@ -22,8 +22,8 @@ Vue.use(Sku); :reset-stepper-on-hide="resetStepperOnHide" :reset-selected-sku-on-hide="resetSelectedSkuOnHide" :disable-stepper-input="disableStepperInput" - @buy-clicked="handleBuyClicked" - @add-cart="handleAddCartClicked" + @buy-clicked="onBuyClicked" + @add-cart="onAddCartClicked" /> ``` @@ -42,16 +42,14 @@ Vue.use(Sku); :quota-used="quotaUsed" :reset-stepper-on-hide="true" :initial-sku="initialSku" - @buy-clicked="handleBuyClicked" - @add-cart="handleAddCartClicked" + @buy-clicked="onBuyClicked" + @add-cart="onAddCartClicked" > - - - 积分兑换 - + 积分兑换 + 买买买 @@ -83,6 +81,11 @@ Vue.use(Sku); | add-cart | 点击添加购物车回调 | skuData: Object | | buy-clicked | 点击购买回调 | skuData: Object | +### 方法 + +| 函数 | 说明 | +|-----------|-----------| +| getSkuData() | 获取当前 skuData | ### Slot Sku 组件默认划分好了若干区块,这些区块都定义成了 slot,可以按需进行替换。区块顺序见下表: diff --git a/packages/sku/Sku.vue b/packages/sku/Sku.vue index 4360b149e..475c86de3 100644 --- a/packages/sku/Sku.vue +++ b/packages/sku/Sku.vue @@ -251,12 +251,12 @@ export default create({ const skuEventBus = new Vue(); this.skuEventBus = skuEventBus; - skuEventBus.$on('sku:close', this.handleCloseClicked); - skuEventBus.$on('sku:select', this.handleSkuSelected); - skuEventBus.$on('sku:numChange', this.handleNumChange); - skuEventBus.$on('sku:overLimit', this.handleOverLimit); - skuEventBus.$on('sku:addCart', this.handleAddCartClicked); - skuEventBus.$on('sku:buy', this.handleBuyClicked); + skuEventBus.$on('sku:close', this.onCloseClicked); + skuEventBus.$on('sku:select', this.onSkuSelected); + skuEventBus.$on('sku:numChange', this.onNumChange); + skuEventBus.$on('sku:overLimit', this.onOverLimit); + skuEventBus.$on('sku:addCart', this.onAddCartClicked); + skuEventBus.$on('sku:buy', this.onBuyClicked); this.resetSelectedSku(this.skuTree); // 组件初始化后的钩子,抛出skuEventBus @@ -306,11 +306,11 @@ export default create({ } }, - handleCloseClicked() { + onCloseClicked() { this.show = false; }, - handleSkuSelected(skuValue) { + onSkuSelected(skuValue) { // 点击已选中的sku时则取消选中 this.selectedSku = this.selectedSku[skuValue.skuKeyStr] === skuValue.id @@ -324,11 +324,11 @@ export default create({ }); }, - handleNumChange(num) { + onNumChange(num) { this.selectedNum = num; }, - handleOverLimit({ action, limitType, quota, quotaUsed }) { + onOverLimit({ action, limitType, quota, quotaUsed }) { if (action === 'minus') { Toast(this.$t('least')); } else if (action === 'plus') { @@ -342,27 +342,31 @@ export default create({ } }, - handleAddCartClicked() { - this.handleBuyOrAddCart('add-cart'); + onAddCartClicked() { + this.onBuyOrAddCart('add-cart'); }, - handleBuyClicked() { - this.handleBuyOrAddCart('buy-clicked'); + onBuyClicked() { + this.onBuyOrAddCart('buy-clicked'); }, - handleBuyOrAddCart(type) { + onBuyOrAddCart(type) { const error = this.validateSku(); if (error) { Toast(error); - return; + } else { + this.$emit(type, this.getSkuData()); } - this.$emit(type, { + }, + + getSkuData() { + return { goodsId: this.goodsId, selectedNum: this.selectedNum, selectedSkuComb: this.selectedSkuComb, messages: this.getSkuMessages(), cartMessages: this.getSkuCartMessages() - }); + }; } } });