mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
Remove $listeners and the redundant v-bind="$attrs"
This commit is contained in:
parent
74267e5531
commit
7a91728e29
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<a v-bind="$attrs" :target="newTab ? '_blank' : null" v-on="$listeners">
|
||||
<a :target="newTab ? '_blank' : null">
|
||||
<slot />
|
||||
</a>
|
||||
</template>
|
||||
|
||||
@ -11,6 +11,7 @@ export default defineComponent({
|
||||
components: {
|
||||
VideoCard,
|
||||
},
|
||||
inheritAttrs: false,
|
||||
})
|
||||
</script>
|
||||
<style lang="scss">
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
<template v-else class="status">
|
||||
<div class="status-dot disconnected" />
|
||||
<div class="status-text">未连接</div>
|
||||
<AsyncButton title="连接" @click="connect">
|
||||
<AsyncButton title="连接" wait-on-click="connect">
|
||||
<VIcon icon="mdi-play" :size="14" />
|
||||
连接
|
||||
</AsyncButton>
|
||||
|
||||
@ -1,14 +1,10 @@
|
||||
<template>
|
||||
<VButton
|
||||
v-bind="$attrs"
|
||||
:disabled="disabled || internalDisabled"
|
||||
v-on="listeners"
|
||||
@click="onClick"
|
||||
>
|
||||
<VButton :disabled="disabled || isWaitingClickEnd" @click="onClick">
|
||||
<slot>Button</slot>
|
||||
</VButton>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import type { PropType } from 'vue'
|
||||
import { defineComponent } from 'vue'
|
||||
import VButton from './VButton.vue'
|
||||
|
||||
@ -21,26 +17,22 @@ export default defineComponent({
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
waitOnClick: {
|
||||
type: Function as PropType<() => Promise<void>>,
|
||||
default: undefined,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
internalDisabled: false,
|
||||
isWaitingClickEnd: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-types
|
||||
listeners(): Record<string, Function | Function[]> {
|
||||
return lodash.omit(this.$listeners, 'click')
|
||||
},
|
||||
onClick(): (...args: unknown[]) => Promise<void> {
|
||||
return async (...args: unknown[]) => {
|
||||
try {
|
||||
this.internalDisabled = true
|
||||
await this.$listeners.click?.(...args)
|
||||
} finally {
|
||||
this.internalDisabled = false
|
||||
}
|
||||
}
|
||||
methods: {
|
||||
onClick(): void {
|
||||
this.isWaitingClickEnd = true
|
||||
this.waitOnClick().finally(() => {
|
||||
this.isWaitingClickEnd = false
|
||||
})
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
@ -5,7 +5,6 @@
|
||||
role="checkbox"
|
||||
:aria-checked="checked"
|
||||
type="transparent"
|
||||
v-bind="$attrs"
|
||||
@click="$emit('update:checked', !checked)"
|
||||
>
|
||||
<div class="text-container">
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<VButton class="default-widget" v-bind="$attrs" v-on="$listeners">
|
||||
<VButton class="default-widget">
|
||||
<div class="widget-icon">
|
||||
<slot name="icon">
|
||||
<VIcon :type="iconType" :icon="icon"></VIcon>
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<img
|
||||
v-bind="$attrs"
|
||||
:width="width"
|
||||
:height="height"
|
||||
:srcset="srcset"
|
||||
|
||||
@ -2,7 +2,6 @@
|
||||
<CheckBox
|
||||
class="be-radio-button"
|
||||
role="radio"
|
||||
v-bind="$attrs"
|
||||
:checked="checked"
|
||||
:checked-icon="checkedIcon"
|
||||
:not-checked-icon="notCheckedIcon"
|
||||
|
||||
@ -3,9 +3,8 @@
|
||||
<textarea
|
||||
ref="input"
|
||||
type="text"
|
||||
v-bind="$attrs"
|
||||
v-bind="restattrs"
|
||||
:value="text"
|
||||
v-on="restListeners"
|
||||
@change.stop="change"
|
||||
@input.stop="input"
|
||||
@compositionstart="compositionStart"
|
||||
|
||||
@ -3,9 +3,8 @@
|
||||
<input
|
||||
ref="input"
|
||||
type="text"
|
||||
v-bind="$attrs"
|
||||
v-bind="restAttrs"
|
||||
:value="text"
|
||||
v-on="restListeners"
|
||||
@change.stop="change"
|
||||
@input.stop="input"
|
||||
@compositionstart="compositionStart"
|
||||
|
||||
@ -5,9 +5,9 @@
|
||||
:aria-disabled="disabled"
|
||||
:tabindex="disabled ? -1 : 0"
|
||||
:class="{ [type]: true, disabled, round, icon }"
|
||||
v-on="disabled ? null : $listeners"
|
||||
@keydown.enter.prevent="$listeners.click && $listeners.click($event)"
|
||||
@keydown.space.prevent="$listeners.click && $listeners.click($event)"
|
||||
v-bind="attrs"
|
||||
@keydown.enter.prevent="$emit('click')"
|
||||
@keydown.space.prevent="$emit('click')"
|
||||
>
|
||||
<div class="content-container">
|
||||
<slot>Button</slot>
|
||||
@ -20,6 +20,7 @@ import { defineComponent } from 'vue'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'VButton',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
@ -34,7 +35,13 @@ export default defineComponent({
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
emits: ['click'],
|
||||
computed: {
|
||||
attrs(): Record<string, unknown> {
|
||||
return this.disabled
|
||||
? lodash.omitBy(this.$attrs, (value, key) => key.startsWith('on'))
|
||||
: this.$attrs
|
||||
},
|
||||
disabled(): boolean {
|
||||
return Boolean(this.$attrs.disabled)
|
||||
},
|
||||
|
||||
@ -1,9 +1,5 @@
|
||||
<template>
|
||||
<div
|
||||
class="be-popup"
|
||||
:class="{ open, fixed, close: !open, 'closed-style': closedStyle }"
|
||||
v-on="$listeners"
|
||||
>
|
||||
<div class="be-popup" :class="{ open, fixed, close: !open, 'closed-style': closedStyle }">
|
||||
<slot v-if="loaded"></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,11 +1,5 @@
|
||||
<template>
|
||||
<i
|
||||
class="be-icon"
|
||||
:class="classes"
|
||||
:style="{ '--size': size + 'px' }"
|
||||
v-bind="$attrs"
|
||||
v-on="$listeners"
|
||||
>
|
||||
<i class="be-icon" :class="classes" :style="{ '--size': size + 'px' }">
|
||||
<slot></slot>
|
||||
<div
|
||||
v-if="icon in $options.static.customIcons"
|
||||
|
||||
@ -2,6 +2,7 @@ import { defineComponent } from 'vue'
|
||||
import type { PropType } from 'vue'
|
||||
|
||||
export const textControlMixin = defineComponent({
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
text: {
|
||||
type: String,
|
||||
@ -22,12 +23,12 @@ export const textControlMixin = defineComponent({
|
||||
data() {
|
||||
return {
|
||||
composing: false,
|
||||
restListeners: lodash.omit(
|
||||
this.$listeners,
|
||||
'change',
|
||||
'input',
|
||||
'compositionstart',
|
||||
'compositionend',
|
||||
restAttrs: lodash.omit(
|
||||
this.$attrs,
|
||||
'onChange',
|
||||
'onInput',
|
||||
'onCompositionstart',
|
||||
'onCompositionend',
|
||||
),
|
||||
}
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user