mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 20:19:34 +01:00
fix(Button): duplicate click handlers (#2213)
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
@@ -25,7 +25,7 @@ export interface ButtonProps extends UseComponentIconsProps, Omit<LinkProps, 'ra
|
||||
block?: boolean
|
||||
/** Set loading state automatically based on the `@click` promise state */
|
||||
loadingAuto?: boolean
|
||||
onClick?: (event: Event) => void | Promise<void>
|
||||
onClick?: ((event: MouseEvent) => void | Promise<void>) | Array<((event: MouseEvent) => void | Promise<void>)>
|
||||
class?: any
|
||||
ui?: PartialString<typeof button.slots>
|
||||
}
|
||||
@@ -56,10 +56,11 @@ const { orientation, size: buttonSize } = useButtonGroup<ButtonProps>(props)
|
||||
const loadingAutoState = ref(false)
|
||||
const formLoading = inject<Ref<boolean> | undefined>(formLoadingInjectionKey, undefined)
|
||||
|
||||
async function onClickWrapper(event: Event) {
|
||||
async function onClickWrapper(event: MouseEvent) {
|
||||
loadingAutoState.value = true
|
||||
const callbacks = Array.isArray(props.onClick) ? props.onClick : [props.onClick]
|
||||
try {
|
||||
await props.onClick?.(event)
|
||||
await Promise.all(callbacks.map(fn => fn?.(event)))
|
||||
} finally {
|
||||
loadingAutoState.value = false
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@ export interface LinkBaseProps {
|
||||
as?: string
|
||||
type?: string
|
||||
disabled?: boolean
|
||||
click?: (e: MouseEvent) => void
|
||||
onClick?: (e: MouseEvent) => void | Promise<void>
|
||||
href?: string
|
||||
navigate?: (e: MouseEvent) => void
|
||||
rel?: string
|
||||
@@ -20,15 +20,15 @@ const props = withDefaults(defineProps<LinkBaseProps>(), {
|
||||
type: 'button'
|
||||
})
|
||||
|
||||
function onClick(e: MouseEvent) {
|
||||
function onClickWrapper(e: MouseEvent) {
|
||||
if (props.disabled) {
|
||||
e.stopPropagation()
|
||||
e.preventDefault()
|
||||
return
|
||||
}
|
||||
|
||||
if (props.click) {
|
||||
props.click(e)
|
||||
if (props.onClick) {
|
||||
props.onClick(e)
|
||||
}
|
||||
|
||||
if (props.href && props.navigate && !props.isExternal) {
|
||||
@@ -54,7 +54,7 @@ function onClick(e: MouseEvent) {
|
||||
}"
|
||||
:rel="rel"
|
||||
:target="target"
|
||||
@click="onClick"
|
||||
@click="onClickWrapper"
|
||||
>
|
||||
<slot />
|
||||
</Primitive>
|
||||
|
||||
Reference in New Issue
Block a user