From 63bddbddfbe213afbb2d05e90e32814552c2f39c Mon Sep 17 00:00:00 2001 From: neverland Date: Wed, 5 Sep 2018 14:40:05 +0800 Subject: [PATCH] [breaking change] use es module (#499) --- dist/behaviors/button.js | 2 +- dist/behaviors/touch.js | 2 +- dist/behaviors/transition.js | 52 +++++++++++++++++++++++++++++ dist/button/behaviors.js | 57 -------------------------------- dist/button/index.js | 22 +++++------- dist/common/classnames.js | 2 +- dist/popup/index.js | 18 +++++++++- dist/popup/index.json | 5 ++- dist/popup/index.wxml | 17 ++++++---- dist/popup/index.wxss | 2 +- dist/slider/index.js | 2 +- dist/transition/index.js | 52 +++-------------------------- dist/utils/index.js | 2 +- packages/behaviors/button.js | 2 +- packages/behaviors/touch.js | 2 +- packages/behaviors/transition.js | 2 +- packages/button/index.js | 22 +++++------- packages/common/classnames.js | 2 +- packages/popup/index.js | 2 +- packages/slider/index.js | 2 +- packages/transition/index.js | 2 +- packages/utils/index.js | 2 +- 22 files changed, 120 insertions(+), 153 deletions(-) create mode 100644 dist/behaviors/transition.js delete mode 100644 dist/button/behaviors.js diff --git a/dist/behaviors/button.js b/dist/behaviors/button.js index 5473fcf4..82ee5675 100644 --- a/dist/behaviors/button.js +++ b/dist/behaviors/button.js @@ -1,4 +1,4 @@ -module.exports = Behavior({ +export default Behavior({ properties: { loading: Boolean, // 在自定义组件中，无法与外界的 form 组件联动，暂时不开放 diff --git a/dist/behaviors/touch.js b/dist/behaviors/touch.js index 729db5a2..19ce84a2 100644 --- a/dist/behaviors/touch.js +++ b/dist/behaviors/touch.js @@ -1,4 +1,4 @@ -module.exports = Behavior({ +export default Behavior({ methods: { touchStart(event) { this.direction = ''; diff --git a/dist/behaviors/transition.js b/dist/behaviors/transition.js new file mode 100644 index 00000000..54f3489f --- /dev/null +++ b/dist/behaviors/transition.js @@ -0,0 +1,52 @@ +export default Behavior({ + properties: { + customStyle: String, + show: { + value: true, + type: Boolean, + observer(value) { + if (value) { + this.show(); + } else { + this.setData({ + type: 'leave' + }); + } + } + }, + duration: { + type: Number, + value: 300 + } + }, + + data: { + type: '', + inited: false, + display: false + }, + + attached() { + if (this.data.show) { + this.show(); + } + }, + + methods: { + show() { + this.setData({ + inited: true, + display: true, + type: 'enter' + }); + }, + + onAnimationEnd() { + if (!this.data.show) { + this.setData({ + display: false + }); + } + } + } +}); diff --git a/dist/button/behaviors.js b/dist/button/behaviors.js deleted file mode 100644 index 5473fcf4..00000000 --- a/dist/button/behaviors.js +++ /dev/null @@ -1,57 +0,0 @@ -module.exports = Behavior({ - properties: { - loading: Boolean, - // 在自定义组件中，无法与外界的 form 组件联动，暂时不开放 - // formType: String, - openType: String, - appParameter: String, - // 暂时不开放，直接传入无法设置样式 - // hoverClass: { - // type: String, - // value: 'button-hover' - // }, - hoverStopPropagation: Boolean, - hoverStartTime: { - type: Number, - value: 20 - }, - hoverStayTime: { - type: Number, - value: 70 - }, - lang: { - type: String, - value: 'en' - }, - sessionFrom: { - type: String, - value: '' - }, - sendMessageTitle: String, - sendMessagePath: String, - sendMessageImg: String, - showMessageCard: String - }, - - methods: { - bindgetuserinfo(event = {}) { - this.triggerEvent('getuserinfo', event.detail || {}); - }, - - bindcontact(event = {}) { - this.triggerEvent('contact', event.detail || {}); - }, - - bindgetphonenumber(event = {}) { - this.triggerEvent('getphonenumber', event.detail || {}); - }, - - bindopensetting(event = {}) { - this.triggerEvent('opensetting', event.detail || {}); - }, - - binderror(event = {}) { - this.triggerEvent('error', event.detail || {}); - } - } -}); diff --git a/dist/button/index.js b/dist/button/index.js index 9f1f18c8..2247c09f 100644 --- a/dist/button/index.js +++ b/dist/button/index.js @@ -1,9 +1,5 @@ -const buttonBehaviors = require('../behaviors/button'); -const classnames = require('../common/classnames'); - -const observer = function() { - this.setClasses(); -}; +import buttonBehaviors from '../behaviors/button'; +import classnames from '../common/classnames'; Component({ options: { @@ -18,32 +14,32 @@ Component({ type: { type: String, value: 'default', - observer + observer: 'setClasses' }, size: { type: String, value: 'normal', - observer + observer: 'setClasses' }, plain: { type: Boolean, - observer + observer: 'setClasses' }, disabled: { type: Boolean, - observer + observer: 'setClasses' }, loading: { type: Boolean, - observer + observer: 'setClasses' }, block: { type: Boolean, - observer + observer: 'setClasses' }, square: { type: Boolean, - observer + observer: 'setClasses' } }, diff --git a/dist/common/classnames.js b/dist/common/classnames.js index 71c74a3e..12904405 100644 --- a/dist/common/classnames.js +++ b/dist/common/classnames.js @@ -1,6 +1,6 @@ const hasOwn = {}.hasOwnProperty; -module.exports = function classNames() { +export default function classNames() { const classes = []; for (let i = 0; i < arguments.length; i++) { diff --git a/dist/popup/index.js b/dist/popup/index.js index 047ea7ef..51d41237 100644 --- a/dist/popup/index.js +++ b/dist/popup/index.js @@ -1,3 +1,5 @@ +import transitionBehaviors from '../behaviors/transition'; + Component({ options: { addGlobalClass: true @@ -8,9 +10,23 @@ Component({ 'overlay-class' ], + behaviors: [transitionBehaviors], + properties: { - show: Boolean, overlayStyle: String, + show: { + value: false, + type: Boolean, + observer(value) { + if (value) { + this.show(); + } else { + this.setData({ + type: 'leave' + }); + } + } + }, overlay: { type: Boolean, value: true diff --git a/dist/popup/index.json b/dist/popup/index.json index 467ce294..0dd2931d 100644 --- a/dist/popup/index.json +++ b/dist/popup/index.json @@ -1,3 +1,6 @@ { - "component": true + "component": true, + "usingComponents": { + "van-overlay": "../overlay/index" + } } diff --git a/dist/popup/index.wxml b/dist/popup/index.wxml index daf74aa9..83b9bb1d 100644 --- a/dist/popup/index.wxml +++ b/dist/popup/index.wxml @@ -1,9 +1,14 @@ - - + diff --git a/dist/popup/index.wxss b/dist/popup/index.wxss index 2f555ed2..afc0ec37 100644 --- a/dist/popup/index.wxss +++ b/dist/popup/index.wxss @@ -1 +1 @@ -.van-popup{top:50%;left:50%;z-index:11;max-height:100%;overflow-y:auto;box-sizing:border-box;background-color:#fff;-webkit-overflow-scrolling:touch;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}.van-popup,.van-popup__overlay{display:none;position:fixed;-webkit-animation:van-fade-in .3s ease;animation:van-fade-in .3s ease}.van-popup__overlay{width:100%;height:100%;top:0;left:0;z-index:10;background-color:rgba(0,0,0,.7)}.van-popup--top{width:100%;top:0;right:auto;bottom:auto;left:50%;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0);-webkit-animation-name:van-popup-top;animation-name:van-popup-top}.van-popup--right{top:50%;right:0;bottom:auto;left:auto;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);-webkit-animation-name:van-popup-right;animation-name:van-popup-right}.van-popup--bottom{width:100%;top:auto;bottom:0;right:auto;left:50%;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0);-webkit-animation-name:van-popup-bottom;animation-name:van-popup-bottom}.van-popup--left{top:50%;right:auto;bottom:auto;left:0;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);-webkit-animation-name:van-popup-left;animation-name:van-popup-left}.van-popup--show{display:block}@-webkit-keyframes van-popup-top{from{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}}@keyframes van-popup-top{from{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}}@-webkit-keyframes van-popup-bottom{from{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}}@keyframes van-popup-bottom{from{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}}@-webkit-keyframes van-popup-left{from{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}}@keyframes van-popup-left{from{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}}@-webkit-keyframes van-popup-right{from{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}}@keyframes van-popup-right{from{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}}@-webkit-keyframes van-fade-in{from{opacity:0}to{opacity:1}}@keyframes van-fade-in{from{opacity:0}to{opacity:1}} \ No newline at end of file +.van-popup{top:50%;left:50%;z-index:11;position:fixed;max-height:100%;overflow-y:auto;box-sizing:border-box;background-color:#fff;-webkit-overflow-scrolling:touch;-webkit-animation:ease both;animation:ease both}.van-popup--center{-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}.van-popup--top{width:100%;top:0;right:auto;bottom:auto;left:50%}.van-popup--right{top:50%;right:0;bottom:auto;left:auto}.van-popup--bottom{width:100%;top:auto;bottom:0;right:auto;left:50%}.van-popup--left{top:50%;right:auto;bottom:auto;left:0}@-webkit-keyframes van-center-enter{from{opacity:0}to{opacity:1}}@keyframes van-center-enter{from{opacity:0}to{opacity:1}}@-webkit-keyframes van-center-leave{from{opacity:1}to{opacity:0}}@keyframes van-center-leave{from{opacity:1}to{opacity:0}}@-webkit-keyframes van-bottom-enter{from{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@keyframes van-bottom-enter{from{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@-webkit-keyframes van-bottom-leave{from{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}to{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}}@keyframes van-bottom-leave{from{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}to{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}}@-webkit-keyframes van-top-enter{from{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@keyframes van-top-enter{from{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}to{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}}@-webkit-keyframes van-top-leave{from{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}to{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}}@keyframes van-top-leave{from{-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}to{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}}@-webkit-keyframes van-left-enter{from{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}to{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}}@keyframes van-left-enter{from{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}to{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}}@-webkit-keyframes van-left-leave{from{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}to{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}}@keyframes van-left-leave{from{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}to{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}}@-webkit-keyframes van-right-enter{from{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}to{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}}@keyframes van-right-enter{from{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}to{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}}@-webkit-keyframes van-right-leave{from{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}to{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}}@keyframes van-right-leave{from{-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}to{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}} \ No newline at end of file diff --git a/dist/slider/index.js b/dist/slider/index.js index ee3f3e9f..86971d2b 100644 --- a/dist/slider/index.js +++ b/dist/slider/index.js @@ -1,4 +1,4 @@ -const touchBehaviors = require('../behaviors/touch'); +import touchBehaviors from '../behaviors/touch'; Component({ options: { diff --git a/dist/transition/index.js b/dist/transition/index.js index ad6fc717..30003d3b 100644 --- a/dist/transition/index.js +++ b/dist/transition/index.js @@ -1,3 +1,5 @@ +import transitionBehaviors from '../behaviors/transition'; + Component({ options: { addGlobalClass: true @@ -5,58 +7,12 @@ Component({ externalClasses: ['custom-class'], + behaviors: [transitionBehaviors], + properties: { - customStyle: String, - show: { - value: true, - type: Boolean, - observer(value) { - if (value) { - this.show(); - } else { - this.setData({ - type: 'leave' - }); - } - } - }, name: { type: String, value: 'fade' - }, - duration: { - type: Number, - value: 300 - } - }, - - data: { - type: '', - inited: false, - display: false - }, - - attached() { - if (this.data.show) { - this.show(); - } - }, - - methods: { - show() { - this.setData({ - inited: true, - display: true, - type: 'enter' - }); - }, - - onAnimationEnd() { - if (!this.data.show) { - this.setData({ - display: false - }); - } } } }); diff --git a/dist/utils/index.js b/dist/utils/index.js index 44f8e829..6c78af71 100644 --- a/dist/utils/index.js +++ b/dist/utils/index.js @@ -7,7 +7,7 @@ function isObj(x) { return x !== null && (type === 'object' || type === 'function'); } -module.exports = { +export default { isObj, isDef }; diff --git a/packages/behaviors/button.js b/packages/behaviors/button.js index 5473fcf4..82ee5675 100644 --- a/packages/behaviors/button.js +++ b/packages/behaviors/button.js @@ -1,4 +1,4 @@ -module.exports = Behavior({ +export default Behavior({ properties: { loading: Boolean, // 在自定义组件中，无法与外界的 form 组件联动，暂时不开放 diff --git a/packages/behaviors/touch.js b/packages/behaviors/touch.js index 729db5a2..19ce84a2 100644 --- a/packages/behaviors/touch.js +++ b/packages/behaviors/touch.js @@ -1,4 +1,4 @@ -module.exports = Behavior({ +export default Behavior({ methods: { touchStart(event) { this.direction = ''; diff --git a/packages/behaviors/transition.js b/packages/behaviors/transition.js index a4a08ed3..54f3489f 100644 --- a/packages/behaviors/transition.js +++ b/packages/behaviors/transition.js @@ -1,4 +1,4 @@ -module.exports = Behavior({ +export default Behavior({ properties: { customStyle: String, show: { diff --git a/packages/button/index.js b/packages/button/index.js index 9f1f18c8..2247c09f 100644 --- a/packages/button/index.js +++ b/packages/button/index.js @@ -1,9 +1,5 @@ -const buttonBehaviors = require('../behaviors/button'); -const classnames = require('../common/classnames'); - -const observer = function() { - this.setClasses(); -}; +import buttonBehaviors from '../behaviors/button'; +import classnames from '../common/classnames'; Component({ options: { @@ -18,32 +14,32 @@ Component({ type: { type: String, value: 'default', - observer + observer: 'setClasses' }, size: { type: String, value: 'normal', - observer + observer: 'setClasses' }, plain: { type: Boolean, - observer + observer: 'setClasses' }, disabled: { type: Boolean, - observer + observer: 'setClasses' }, loading: { type: Boolean, - observer + observer: 'setClasses' }, block: { type: Boolean, - observer + observer: 'setClasses' }, square: { type: Boolean, - observer + observer: 'setClasses' } }, diff --git a/packages/common/classnames.js b/packages/common/classnames.js index 71c74a3e..12904405 100644 --- a/packages/common/classnames.js +++ b/packages/common/classnames.js @@ -1,6 +1,6 @@ const hasOwn = {}.hasOwnProperty; -module.exports = function classNames() { +export default function classNames() { const classes = []; for (let i = 0; i < arguments.length; i++) { diff --git a/packages/popup/index.js b/packages/popup/index.js index 856a3c49..51d41237 100644 --- a/packages/popup/index.js +++ b/packages/popup/index.js @@ -1,4 +1,4 @@ -const transitionBehaviors = require('../behaviors/transition'); +import transitionBehaviors from '../behaviors/transition'; Component({ options: { diff --git a/packages/slider/index.js b/packages/slider/index.js index ee3f3e9f..86971d2b 100644 --- a/packages/slider/index.js +++ b/packages/slider/index.js @@ -1,4 +1,4 @@ -const touchBehaviors = require('../behaviors/touch'); +import touchBehaviors from '../behaviors/touch'; Component({ options: { diff --git a/packages/transition/index.js b/packages/transition/index.js index 33526dee..30003d3b 100644 --- a/packages/transition/index.js +++ b/packages/transition/index.js @@ -1,4 +1,4 @@ -const transitionBehaviors = require('../behaviors/transition'); +import transitionBehaviors from '../behaviors/transition'; Component({ options: { diff --git a/packages/utils/index.js b/packages/utils/index.js index 44f8e829..6c78af71 100644 --- a/packages/utils/index.js +++ b/packages/utils/index.js @@ -7,7 +7,7 @@ function isObj(x) { return x !== null && (type === 'object' || type === 'function'); } -module.exports = { +export default { isObj, isDef };