1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
| export interface TabbarItem {
| name: string
| value: number | null
| active: boolean
| title: string
| activeIcon: string
| inactiveIcon: string
| }
|
| const tabbarItems = ref<TabbarItem[]>([
| {
| name: 'home',
| value: null,
| active: true,
| title: '首页',
| activeIcon: '/static/tabbar/home-s.png',
| inactiveIcon: '/static/tabbar/home-no.png',
| },
| {
| name: 'mine',
| value: null,
| active: false,
| title: '我的',
| activeIcon: '/static/tabbar/mine-s.png',
| inactiveIcon: '/static/tabbar/mine-no.png',
| },
| ])
|
| export function useTabbar() {
| const tabbarList = computed(() => tabbarItems.value)
|
| const activeTabbar = computed(() => {
| const item = tabbarItems.value.find(item => item.active)
| return item || tabbarItems.value[0]
| })
|
| const getTabbarItemValue = (name: string) => {
| const item = tabbarItems.value.find(item => item.name === name)
| return item && item.value ? item.value : null
| }
|
| const setTabbarItem = (name: string, value: number) => {
| const tabbarItem = tabbarItems.value.find(item => item.name === name)
| if (tabbarItem) {
| tabbarItem.value = value
| }
| }
|
| const setTabbarItemActive = (name: string) => {
| tabbarItems.value.forEach((item) => {
| if (item.name === name) {
| item.active = true
| }
| else {
| item.active = false
| }
| })
| }
|
| return {
| tabbarList,
| activeTabbar,
| getTabbarItemValue,
| setTabbarItem,
| setTabbarItemActive,
| }
| }
|
|
