优化滚动组件
parent
7407f3d9ad
commit
80cd4adad9
|
@ -96,7 +96,7 @@ function mkWCFile({ style, html, js }) {
|
|||
`
|
||||
)
|
||||
.replace('mounted()', 'connectedCallback()')
|
||||
.replace('unmount()', 'disconnectedCallback()')
|
||||
.replace('unmounted()', 'disconnectedCallback()')
|
||||
.replace(
|
||||
'watch() {',
|
||||
'attributeChangedCallback(name, old, val) {\nif (old === val) {return}'
|
||||
|
|
|
@ -111,7 +111,7 @@ function mkWCFile({ style, html, js }) {
|
|||
`
|
||||
)
|
||||
.replace('mounted()', 'connectedCallback()')
|
||||
.replace('unmount()', 'disconnectedCallback()')
|
||||
.replace('unmounted()', 'disconnectedCallback()')
|
||||
.replace(
|
||||
'watch() {',
|
||||
'attributeChangedCallback(name, old, val) {\nif (old === val) {return}'
|
||||
|
|
|
@ -521,7 +521,7 @@ export default class Color {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__SCENE__, 'mousedown', this.handleDown)
|
||||
$.unbind(document, 'mousedown', this.handleUp)
|
||||
$.unbind(this.__HUE__, 'input', this.handleInput1)
|
||||
|
|
|
@ -356,7 +356,7 @@ export default class Button {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__BTN__, 'click', this._handleClick)
|
||||
}
|
||||
|
||||
|
|
|
@ -265,7 +265,7 @@ export default class Checkbox {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this, 'click', this._handlClick)
|
||||
$.unbind(this, 'keydown', this._handlKeydown)
|
||||
}
|
||||
|
|
|
@ -119,7 +119,7 @@ export default class CheckboxGroup {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this, 'child-picked', this._pickedFn)
|
||||
this.__observer.disconnect()
|
||||
}
|
||||
|
|
|
@ -243,7 +243,7 @@ export default class Dropdown {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
this.state.options = []
|
||||
$.unbind(this.__PREVIEW__, 'click', this._activeFn)
|
||||
$.unbind(this.__OPTIONS__, 'click', this._pickedFn)
|
||||
|
|
|
@ -583,7 +583,7 @@ export default class Input {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__INPUT__, 'keydown', this._handleSubmit)
|
||||
$.unbind(this.__INPUT__, 'input', this._handleChange)
|
||||
$.unbind(this.__INPUT__, 'click', this._parseSuggestion)
|
||||
|
|
|
@ -251,7 +251,7 @@ export default class Link {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__LINK__, 'click', this._handleClick)
|
||||
}
|
||||
|
||||
|
|
|
@ -385,7 +385,7 @@ export default class Number {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__INPUT__, 'keydown', this._handleSubmit)
|
||||
$.unbind(this.__OUTER__, 'click', this._handleAction)
|
||||
}
|
||||
|
|
|
@ -111,7 +111,7 @@ export default class Option {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this, 'click', this._clickFn)
|
||||
}
|
||||
|
||||
|
|
|
@ -412,7 +412,7 @@ export default class Passwd {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__INPUT__, 'keydown', this._handleSubmit)
|
||||
$.unbind(this.__EYE__, 'click', this._eyeFn)
|
||||
}
|
||||
|
|
|
@ -251,7 +251,7 @@ export default class Radio {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this, 'click', this._handleClick)
|
||||
$.unbind(this, 'keydown', this._handlKeydown)
|
||||
}
|
||||
|
|
|
@ -108,7 +108,7 @@ export default class RadioGroup {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this, 'child-picked', this._pickedFn)
|
||||
this.__observer.disconnect()
|
||||
}
|
||||
|
|
|
@ -499,7 +499,7 @@ export default class Select {
|
|||
}
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__INPUT__, 'keydown', this._handleKeydown)
|
||||
$.unbind(this.__INPUT__, 'click', this._activeFn)
|
||||
$.unbind(this.__OPTG__, 'click', this._handleSelect)
|
||||
|
|
|
@ -181,7 +181,7 @@ export default class Switch {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this, 'click', this._handleClick)
|
||||
}
|
||||
|
||||
|
|
|
@ -247,7 +247,7 @@ export default class Textarea {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__INPUT__, 'keydown', this._handleSubmit)
|
||||
$.unbind(this.__INPUT__, 'input,change', this._statFn)
|
||||
}
|
||||
|
|
|
@ -586,7 +586,7 @@ export default class Layer {
|
|||
}
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.clearOutside(this._handlMask)
|
||||
$.unbind(this.__TITLE__, 'click', this._handleClose)
|
||||
$.unbind(this.__CTRL__, 'click', this._handleBtnClick)
|
||||
|
|
|
@ -237,7 +237,7 @@ export default class Markd {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__BOX__, 'click', this._headClickFn)
|
||||
this.__observer.disconnect()
|
||||
this.clear()
|
||||
|
|
|
@ -1005,7 +1005,7 @@ export default class Meditor {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__EDITOR__, 'input', this._inputFn)
|
||||
$.unbind(this.__EDITOR__, 'keydown', this._keydownFn)
|
||||
$.unbind(this.__EDITOR__, 'paste', this._pasteFn)
|
||||
|
|
|
@ -602,7 +602,7 @@ export default class Neditor {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__TOOLBAR__, 'click', this.__toolFn)
|
||||
$.unbind(this.__FONT__, 'click', this.__fontFn)
|
||||
$.unbind(this.__COLOR__, 'click', this.__colorFn)
|
||||
|
|
|
@ -628,7 +628,7 @@ export default class DatePicker {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.unbind(this.__INPUT__, 'click', this._activeFn)
|
||||
$.unbind(this.__DAYS__, 'click', this._pickFn)
|
||||
$.unbind(this.__CTRL__, 'click', this._ctrlFn)
|
||||
|
|
|
@ -125,14 +125,14 @@
|
|||
|
||||
<script>
|
||||
import $ from '../utils'
|
||||
// 是否火狐浏览器
|
||||
const IS_FF = !!window.sidebar
|
||||
|
||||
const AXIS_LIST = ['x', 'y', 'xy']
|
||||
|
||||
/* */
|
||||
export default class Scroll {
|
||||
props = {
|
||||
axis: 'xy', // 滚动方向, 默认x轴和y轴都可以滚动
|
||||
delay: 1000, // 节流延迟
|
||||
delay: 1000, // 节流防抖延迟
|
||||
distance: 1 // 触发距离阀值, 单位像素
|
||||
}
|
||||
|
||||
|
@ -391,9 +391,11 @@ export default class Scroll {
|
|||
subtree: true,
|
||||
attributeFilter: ['style']
|
||||
})
|
||||
|
||||
this._initFn(new Event('mounted'))
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
this.__observer.disconnect()
|
||||
|
||||
$.unbind(this.__X__, 'mousedown', this._xBarFn)
|
||||
|
@ -405,7 +407,15 @@ export default class Scroll {
|
|||
watch() {
|
||||
switch (name) {
|
||||
case 'axis':
|
||||
this.props.axis = val || 'xy'
|
||||
if (val) {
|
||||
if (AXIS_LIST.includes(val)) {
|
||||
this.props.axis = val
|
||||
} else {
|
||||
this.removeAttribute(name)
|
||||
}
|
||||
} else {
|
||||
this.props.axis = 'xy'
|
||||
}
|
||||
break
|
||||
|
||||
case 'delay':
|
||||
|
|
|
@ -226,7 +226,7 @@ export default class Slider {
|
|||
})
|
||||
}
|
||||
|
||||
unmount() {
|
||||
unmounted() {
|
||||
$.bind(this.__RANGE__, 'input', this._inputFn)
|
||||
delete this._inputFn
|
||||
}
|
||||
|
|
Reference in New Issue