fix(tabs): resolve scroll-blocking 'touchmove' event warning in Chrome

[jadelike-wine]

Types of changes

• New feature
• Bug fix
• Enhancement
• Component style change
• Typescript definition change
• Documentation change
• Coding style change
• Refactoring
• Test cases
• Continuous integration
• Breaking change
• Others

Background and context

fix: resolve scroll-blocking 'touchmove' event warning in Chrome


#3387

Solution

// 安装插件
npm install -S default-passive-events
// 在main.js引入
import 'default-passive-events'

How is the change tested?

加入后重启，然后进入tabs页面，打开控制台，http://localhost:2233/vue/component/tabs


可以看到warn没了

Changelog

Component	Changelog(CN)	Changelog(EN)	Related issues
tabs	添加事件管理者’passive’来优化页面的滑动性能，解决Chrome中阻止滚动的touchmove事件警告	resolve scroll-blocking 'touchmove' event warning in Chrome	#3387

Checklist:

• Test suite passes (npm run test)
• Provide changelog for relevant changes (e.g. bug fixes and new features) if applicable.
• Changes are submitted to the appropriate branch (e.g. features should be submitted to feature branch and others
  should be submitted to main branch)

Other information

[codesandbox]

Review or Edit in CodeSandbox

Open the branch in Web Editor • VS Code • Insiders

Open Preview

[oljc]

@jadelike-wine 感谢 PR 但这不是最佳解决方案。

[jadelike-wine]

@jadelike-wine 感谢 PR 但这不是最佳解决方案。

@oljc 我再跟进搜了下，比如这个：https://www.mulingyuer.com/archives/699/

default-passive-events难免会和其他插件产生冲突，比如canvas库konvajs

看了一下stackoverflow上，https://stackoverflow.com/questions/39152877/consider-marking-event-handler-as-passive-to-make-the-page-more-responsive


这个问题看来还是需要等待 .js 库实现支持。