37 lines
934 B
TypeScript
37 lines
934 B
TypeScript
import { provide, reactive, toRefs } from 'vue'
|
|
import { avatarGroupContextKey } from '../../../../tokens'
|
|
import { useOrderedChildren } from '../../../../hooks'
|
|
|
|
import type { SetupContext } from 'vue'
|
|
import type { AvatarContext } from '../../../../tokens'
|
|
import type { AvatarGroupEmits, AvatarGroupProps } from '../avatar-group'
|
|
|
|
export const useAvatarGroup = (
|
|
props: AvatarGroupProps,
|
|
emits: SetupContext<AvatarGroupEmits>['emit']
|
|
) => {
|
|
const {
|
|
children: avatarItems,
|
|
addChild: addItem,
|
|
removeChild: removeItem,
|
|
} = useOrderedChildren<AvatarContext>()
|
|
|
|
const handleItemClick = (uid: number) => {
|
|
// 查找出对应头像的索引
|
|
const index = avatarItems.value.findIndex((item) => item.uid === uid)
|
|
emits('click', index)
|
|
}
|
|
|
|
provide(
|
|
avatarGroupContextKey,
|
|
reactive({
|
|
...toRefs(props),
|
|
|
|
avatarItems,
|
|
addItem,
|
|
removeItem,
|
|
handleItemClick,
|
|
})
|
|
)
|
|
}
|