fix(button,navigator,view): hover-class 不支持 pc 端鼠标事件问题

packages/uni-components/src/helpers/useHover.ts

@@ -40,7 +40,20 @@ export function useHover(props: UseHoverOptions) {
       }, parseInt(props.hoverStayTime as string))
     })
   }
+
   function onTouchstartPassive(evt: TouchEvent) {
+    if (evt.touches.length > 1) {
+      return
+    }
+    handleHover(evt)
+  }
+
+  function onMousedown(evt: MouseEvent) {
+    handleHover(evt)
+    window.addEventListener('mouseup', handlePCHoverEnd)
+  }
+
+  function handleHover(evt: TouchEvent | MouseEvent) {
     // TODO detect scrolling
     if ((evt as any)._hoverPropagationStopped) {
       return
@@ -48,9 +61,6 @@ export function useHover(props: UseHoverOptions) {
     if (!props.hoverClass || props.hoverClass === 'none' || props.disabled) {
       return
     }
-    if (evt.touches.length > 1) {
-      return
-    }
     if (props.hoverStopPropagation) {
       ;(evt as any)._hoverPropagationStopped = true
     }
@@ -63,12 +73,27 @@ export function useHover(props: UseHoverOptions) {
       }
     }, parseInt(props.hoverStartTime as string))
   }
+
   function onTouchend() {
+    handleHoverEnd()
+  }
+
+  function onMouseup() {
+    handlePCHoverEnd()
+  }
+
+  function handleHoverEnd() {
     hoverTouch = false
     if (hovering.value) {
       hoverReset()
     }
   }
+
+  function handlePCHoverEnd() {
+    handleHoverEnd()
+    window.removeEventListener('mouseup', handlePCHoverEnd)
+  }
+
   function onTouchcancel() {
     hoverTouch = false
     hovering.value = false
@@ -78,7 +103,9 @@ export function useHover(props: UseHoverOptions) {
     hovering,
     binding: {
       onTouchstartPassive,
+      onMousedown,
       onTouchend,
+      onMouseup,
       onTouchcancel,
     },
   }

packages/uni-components/src/vue/navigator/index.tsx

@@ -25,8 +25,8 @@ export default /*#__PURE__*/ defineBuiltInComponent({
     return () => {
       const { hoverClass, url } = props
       const hasHoverClass = props.hoverClass && props.hoverClass !== 'none'
+
       return (
-        <a class="navigator-wrap" href={url} onClick={onEventPrevent}>
         <uni-navigator
           class={hasHoverClass && hovering.value ? hoverClass : ''}
           {...(hasHoverClass && binding)}
@@ -36,9 +36,9 @@ export default /*#__PURE__*/ defineBuiltInComponent({
           }}
           onClick={onClick}
         >
+          <a class="navigator-wrap" href={url} onClick={onEventPrevent}></a>
           {slots.default && slots.default()}
         </uni-navigator>
-        </a>
       )
     }
   },