This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0

滚动组件增加禁用状态

old
宇天 2020-04-10 12:56:38 +08:00
parent 62c2776a33
commit 61b2b2d46f
1 changed files with 41 additions and 0 deletions

View File

@ -107,6 +107,7 @@ const IS_FF = !!window.sidebar
/* */
export default class Scroll {
props = {
disabled: false,
axis: 'xy' // 滚动方向, 默认x轴和y轴都可以滚动
}
__init__() {
@ -154,6 +155,25 @@ export default class Scroll {
return this.__BOX__.scrollHeight
}
get disabled() {
return this.props.disabled
}
set disabled(val) {
var type = typeof val
if (val === this.props.disabled) {
return
}
if ((type === 'boolean' && val) || type !== 'boolean') {
this.props.disabled = true
this.setAttribute('disabled', '')
} else {
this.props.disabled = false
this.removeAttribute('disabled')
}
}
_fetchScrollX(moveX) {
var { sw, ow, xw } = this.props
@ -184,6 +204,10 @@ export default class Scroll {
mounted() {
// 初始化滚动条的位置和长度
this._initFn = $.bind(this.__BOX__, 'mouseenter', ev => {
// 禁用状态, 不允许滚动
if (this.disabled) {
return
}
var ow = this.__BOX__.offsetWidth
var sw = this.__BOX__.scrollWidth
var oh = this.__BOX__.offsetHeight
@ -219,6 +243,10 @@ export default class Scroll {
// 鼠标滚动事件
this._wheelFn = $.catch(this.__BOX__, 'wheel', ev => {
// 禁用状态, 不允许滚动
if (this.disabled) {
return
}
var { sh, oh, yh, sw, ow, xw } = this.props
// x轴 y轴 都为0时, 不作任何处理
@ -246,6 +274,8 @@ export default class Scroll {
deltaY = ev.deltaY / (delta / 120)
}
}
//
if (this.props.axis !== 'x') {
this.__BOX__.scrollTop += deltaY
@ -301,6 +331,10 @@ export default class Scroll {
if (!this.props.thumbY) {
this.props.thumbY = 0
}
// 禁用状态, 不允许滚动
if (this.disabled) {
return
}
$.bind(document, 'mousemove', mousemoveFn)
$.bind(document, 'mouseup', mouseupFn)
})
@ -310,6 +344,10 @@ export default class Scroll {
if (!this.props.thumbX) {
this.props.thumbX = 0
}
// 禁用状态, 不允许滚动
if (this.disabled) {
return
}
$.bind(document, 'mousemove', mousemoveFn)
$.bind(document, 'mouseup', mouseupFn)
})
@ -333,6 +371,9 @@ export default class Scroll {
case 'axis':
this.props.axis = val
break
case 'disabled':
this[name] = true
break
}
}
}