From 1caabb892f4b8bd543a92773cbb9717f6d4d0a20 Mon Sep 17 00:00:00 2001 From: saller Date: Mon, 18 Sep 2023 15:31:26 +0800 Subject: [PATCH] fix(pro:search): segment input scroll event doesn't work in safari (#1690) --- .../search/src/components/segment/SegmentInput.tsx | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/packages/pro/search/src/components/segment/SegmentInput.tsx b/packages/pro/search/src/components/segment/SegmentInput.tsx index 4a49c678b..dcc675230 100644 --- a/packages/pro/search/src/components/segment/SegmentInput.tsx +++ b/packages/pro/search/src/components/segment/SegmentInput.tsx @@ -21,6 +21,7 @@ import { import { debounce } from 'lodash-es' +import { isSafari } from '@idux/cdk/platform' import { useResizeObserver } from '@idux/cdk/resize' import { getScroll, setScroll } from '@idux/cdk/scroll' import { callEmit, convertCssPixel, useEventListener, useState } from '@idux/cdk/utils' @@ -231,8 +232,8 @@ function useSegmentScroll( onMounted(() => { if (props.ellipsis) { + /* eslint-disable indent */ listenerStops = [ - useEventListener(inputRef, 'scroll', updateScroll), useResizeObserver(inputRef, () => { if (document.activeElement === inputRef.value) { scrollIntoView() @@ -241,7 +242,15 @@ function useSegmentScroll( }), useEventListener(inputRef, 'input', updateScroll), useEventListener(inputRef, 'compositionend', scrollIntoView), - ] + ...(isSafari + ? [ + useEventListener(inputRef, 'keydown', updateScroll), + useEventListener(inputRef, 'wheel', updateScroll), + useEventListener(inputRef, 'select', updateScroll), + ] + : [useEventListener(inputRef, 'scroll', updateScroll)]), + ].filter(Boolean) + /* eslint-enable indent */ } })