perf: remove chrome passive warning

Author: tangjinzhou

components/_util/pickAttrs.ts

@@ -15,7 +15,7 @@ const eventsName = `onCopy onCut onPaste onCompositionend onCompositionstart onC
     onKeypress onKeyup onFocus onBlur onChange onInput onSubmit onClick onContextmenu onDoubleclick onDblclick
     onDrag onDragend onDragenter onDragexit onDragleave onDragover onDragstart onDrop onMousedown
     onMouseenter onMouseleave onMousemove onMouseout onMouseover onMouseup onSelect onTouchcancel
-    onTouchend onTouchmove onTouchstart onScroll onWheel onAbort onCanplay onCanplaythrough
+    onTouchend onTouchmove onTouchstart onTouchstartPassive onTouchmovePassive onScroll onWheel onAbort onCanplay onCanplaythrough
     onDurationchange onEmptied onEncrypted onEnded onError onLoadeddata onLoadedmetadata
     onLoadstart onPause onPlay onPlaying onProgress onRatechange onSeeked onSeeking onStalled onSuspend onTimeupdate onVolumechange onWaiting onLoad onError`;
 

components/vc-drawer/src/Drawer.js

@@ -439,6 +439,15 @@ const Drawer = defineComponent({
         onKeydown: open && keyboard ? this.onKeyDown : noop,
         style: { ...wrapStyle, ...style },
       };
+      // 跑用例用
+      const touchEvents = {
+        [supportsPassive ? 'onTouchstartPassive' : 'onTouchstart']: open
+          ? this.removeStartHandler
+          : noop,
+        [supportsPassive ? 'onTouchmovePassive' : 'onTouchmove']: open
+          ? this.removeMoveHandler
+          : noop,
+      };
       return (
         <div
           ref={c => {
@@ -475,8 +484,7 @@ const Drawer = defineComponent({
               ref={c => {
                 this.contentDom = c;
               }}
-              onTouchstart={open ? this.removeStartHandler : noop} // 跑用例用
-              onTouchmove={open ? this.removeMoveHandler : noop} // 跑用例用
+              {...touchEvents}
             >
               {children}
             </div>

components/vc-input-number/src/index.js

@@ -6,6 +6,7 @@ import classNames from '../../_util/classNames';
 import KeyCode from '../../_util/KeyCode';
 import InputHandler from './InputHandler';
 import { defineComponent } from 'vue';
+import supportsPassive from '../../_util/supportsPassive';
 
 function preventDefault(e) {
   e.preventDefault();
@@ -699,11 +700,13 @@ export default defineComponent({
     let downEvents;
     if (useTouch) {
       upEvents = {
-        onTouchstart: editable && !upDisabledClass && this.up,
+        [supportsPassive ? 'onTouchstartPassive' : 'onTouchstart']:
+          editable && !upDisabledClass && this.up,
         onTouchend: this.stop,
       };
       downEvents = {
-        onTouchstart: editable && !downDisabledClass && this.down,
+        [supportsPassive ? 'onTouchstartPassive' : 'onTouchstart']:
+          editable && !downDisabledClass && this.down,
         onTouchend: this.stop,
       };
     } else {

components/vc-m-feedback/src/TouchFeedback.jsx

@@ -5,6 +5,7 @@ import warning from '../../_util/warning';
 import BaseMixin from '../../_util/BaseMixin';
 import { ITouchProps } from './PropTypes';
 import { defineComponent } from 'vue';
+import supportsPassive from '../../_util/supportsPassive';
 
 export default defineComponent({
   name: 'TouchFeedback',
@@ -76,8 +77,8 @@ export default defineComponent({
     const events = disabled
       ? undefined
       : {
-          onTouchstart: this.onTouchStart,
-          onTouchmove: this.onTouchMove,
+          [supportsPassive ? 'onTouchstartPassive' : 'onTouchstart']: this.onTouchStart,
+          [supportsPassive ? 'onTouchmovePassive' : 'onTouchmove']: this.onTouchMove,
           onTouchend: this.onTouchEnd,
           onTouchcancel: this.onTouchCancel,
           onMousedown: this.onMouseDown,

components/vc-slick/src/inner-slider.js

@@ -23,6 +23,7 @@ import {
 import Track from './track';
 import Dots from './dots';
 import { PrevArrow, NextArrow } from './arrows';
+import supportsPassive from '../../_util/supportsPassive';
 
 function noop() {}
 
@@ -694,8 +695,11 @@ export default {
       onMousemove: this.dragging && touchMove ? this.swipeMove : noop,
       onMouseup: touchMove ? this.swipeEnd : noop,
       onMouseleave: this.dragging && touchMove ? this.swipeEnd : noop,
-      onTouchstart: touchMove ? this.swipeStart : noop,
-      onTouchmove: this.dragging && touchMove ? this.swipeMove : noop,
+      [supportsPassive ? 'onTouchstartPassive' : 'onTouchstart']: touchMove
+        ? this.swipeStart
+        : noop,
+      [supportsPassive ? 'onTouchmovePassive' : 'onTouchmove']:
+        this.dragging && touchMove ? this.swipeMove : noop,
       onTouchend: touchMove ? this.swipeEnd : noop,
       onTouchcancel: this.dragging && touchMove ? this.swipeEnd : noop,
       onKeydown: this.accessibility ? this.keyHandler : noop,

components/vc-slider/src/common/Marks.jsx

@@ -1,3 +1,4 @@
+import supportsPassive from '../../../_util/supportsPassive';
 import classNames from '../../../_util/classNames';
 import { isValidElement } from '../../../_util/props-util';
 
@@ -51,13 +52,16 @@ const Marks = (_, { attrs }) => {
 
       const style = vertical ? bottomStyle : leftStyle;
       const markStyle = markPointIsObject ? { ...style, ...markPoint.style } : style;
+      const touchEvents = {
+        [supportsPassive ? 'onTouchstartPassive' : 'onTouchstart']: e => onClickLabel(e, point),
+      };
       return (
         <span
           class={markClassName}
           style={markStyle}
           key={point}
           onMousedown={e => onClickLabel(e, point)}
-          onTouchstart={e => onClickLabel(e, point)}
+          {...touchEvents}
         >
           {markLabel}
         </span>

components/vc-slider/src/common/createSlider.jsx

@@ -9,6 +9,7 @@ import Marks from './Marks';
 import Handle from '../Handle';
 import * as utils from '../utils';
 import BaseMixin from '../../../_util/BaseMixin';
+import supportsPassive from '../../../_util/supportsPassive';
 
 function noop() {}
 
@@ -295,13 +296,18 @@ export default function createSlider(Component) {
         class: `${prefixCls}-mark`,
         onClickLabel: disabled ? noop : this.onClickMarkLabel,
       };
+      const touchEvents = {
+        [supportsPassive ? 'onTouchstartPassive' : 'onTouchstart']: disabled
+          ? noop
+          : this.onTouchStart,
+      };
       return (
         <div
           id={id}
           ref={this.saveSlider}
           tabindex="-1"
           class={sliderClassName}
-          onTouchstart={disabled ? noop : this.onTouchStart}
+          {...touchEvents}
           onMousedown={disabled ? noop : this.onMouseDown}
           onMouseup={disabled ? noop : this.onMouseUp}
           onKeydown={disabled ? noop : this.onKeyDown}