Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

improvement(components): @touchstart @touchmove @wheel add passive #16741

Open
wants to merge 9 commits into
base: dev
Choose a base branch
from

Conversation

warmthsea
Copy link
Contributor

@warmthsea warmthsea commented May 2, 2024

image
image

After:

image
image

Copy link

👋 @warmthsea, thank you for contributing element-plus.

  • You can comment with /label Components:[component_name] to add a label for which component you are working on.
  • You may join our Discord for staying tuned.

Copy link

github-actions bot commented May 2, 2024

Copy link

github-actions bot commented May 2, 2024

Hello @warmthsea, thank you for contributing to element-plus, please see our guideline to see how to make contribution

Copy link

github-actions bot commented May 2, 2024

🧪 Playground Preview: https://element-plus.run/?pr=16741
Please comment the example via this playground if needed.

@warmthsea
Copy link
Contributor Author

I have another question:
#16742

packages/components/slider/src/slider.vue Outdated Show resolved Hide resolved
packages/components/color-picker/src/utils/draggable.ts Outdated Show resolved Hide resolved
packages/components/slider/src/button.vue Outdated Show resolved Hide resolved
@warmthsea warmthsea changed the title perf(components): @touchstart @touchmove add passive perf(components): @touchstart @touchmove @wheel add passive May 3, 2024
@btea btea changed the title perf(components): @touchstart @touchmove @wheel add passive improvement(components): @touchstart @touchmove @wheel add passive May 3, 2024
@btea
Copy link
Collaborator

btea commented May 3, 2024

The touchmove event here can also be handled. A warning message will also appear when dragging the scroll bar of table-v2.

thumbEl.addEventListener('touchmove', onMouseMove)

useEventListener(sliderWrapper, 'touchmove', onSliderWrapperPrevent, {
passive: false,
})

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It can be merged here, useEventListener supports setting multiple events.

There is another question. To prevent SSR errors, maybe we should put the event binding logic in onMounted hook. 🤔

passive: false,
})
})

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
useEventListener(sliderWrapper, ['touchstart', 'touchmove'], [onSliderWrapperPrevent, onSliderWrapperPrevent], { passive: false })

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants