refactor: tidy injections of dropdown

This commit is contained in:
三咲智子 2023-01-03 19:58:08 +08:00
parent 4a3cef9a01
commit ef417f3ccf
No known key found for this signature in database
GPG key ID: 69992F2250DFD93E
5 changed files with 14 additions and 12 deletions

View file

@ -1,5 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { dropdownContextKey } from './ctx' import { InjectionKeyDropdownContext } from '~/constants/symbols'
defineProps<{ defineProps<{
placement?: string placement?: string
}>() }>()
@ -8,7 +9,7 @@ const dropdown = $ref<any>()
const colorMode = useColorMode() const colorMode = useColorMode()
const hide = () => dropdown.hide() const hide = () => dropdown.hide()
provide(dropdownContextKey, { provide(InjectionKeyDropdownContext, {
hide, hide,
}) })

View file

@ -1,6 +1,4 @@
<script setup lang="ts"> <script setup lang="ts">
import { dropdownContextKey } from './ctx'
const props = defineProps<{ const props = defineProps<{
text?: string text?: string
description?: string description?: string
@ -10,7 +8,7 @@ const props = defineProps<{
}>() }>()
const emit = defineEmits(['click']) const emit = defineEmits(['click'])
const { hide } = inject(dropdownContextKey, undefined) || {} const { hide } = useDropdownContext() || {}
const el = ref<HTMLDivElement>() const el = ref<HTMLDivElement>()

View file

@ -1,5 +0,0 @@
import type { InjectionKey } from 'vue'
export const dropdownContextKey: InjectionKey<{
hide: () => void
}> = Symbol('dropdownContextKey')

View file

@ -1,5 +1,9 @@
import { InjectionKeyFontSize } from '~/constants/symbols' import { InjectionKeyDropdownContext, InjectionKeyFontSize } from '~/constants/symbols'
export function useFontSizeRef() { export function useFontSizeRef() {
return inject(InjectionKeyFontSize)! return inject(InjectionKeyFontSize)!
} }
export function useDropdownContext() {
return inject(InjectionKeyDropdownContext, undefined)
}

View file

@ -1,4 +1,8 @@
import type { InjectionKey, Ref } from 'vue' import type { InjectionKey, Ref } from 'vue'
import type { FontSize } from '~/types' import type { FontSize } from '~/types'
export const InjectionKeyFontSize = Symbol('font-size') as InjectionKey<Ref<FontSize>> export const InjectionKeyFontSize: InjectionKey<Ref<FontSize>> = Symbol('font-size')
export const InjectionKeyDropdownContext: InjectionKey<{
hide: () => void
}> = Symbol('dropdown-context')