Skip to content

Commit

Permalink
Merge pull request #141 from hwaphon/feature/movable-view-scroll-support
Browse files Browse the repository at this point in the history
feat(runtime-web): movable-view 组件在设置成仅水平方向可滚动时,取消掉禁止默认行为以支持纵向滚动
  • Loading branch information
hwaphon authored Dec 27, 2023
2 parents dfb349b + 52e9756 commit fb3feea
Showing 1 changed file with 9 additions and 5 deletions.
14 changes: 9 additions & 5 deletions packages/runtime-web/src/components/src/views/movable-view.ts
Original file line number Diff line number Diff line change
Expand Up @@ -53,16 +53,21 @@ export default class MovableView extends BaseElement {
this.updatePosition()
}

preventDefault(event) {
if (this.direction !== 'horizontal') {
event.preventDefault()
}
}

onTouchStart = (e: TouchEvent) => {
// e.stopPropagation();
e.preventDefault()
this.preventDefault(e)
this.canMove = true
}

private canMove = false
private lastPoint: { clientX; clientY }
onMouseMove = (e: MouseEvent) => {
e.preventDefault()
this.preventDefault(e)
if (e.buttons === 1) {
// 只有鼠标左键处于按下状态才算
this.onMove({ clientX: e.clientX, clientY: e.clientY })
Expand All @@ -74,8 +79,7 @@ export default class MovableView extends BaseElement {
}

onTouchMove = (e: TouchEvent) => {
// e.stopPropagation();
e.preventDefault()
this.preventDefault(e)
const currentTouch = e.touches[0]
this.onMove({
clientX: currentTouch.clientX,
Expand Down

0 comments on commit fb3feea

Please sign in to comment.