组合式函数

项目封装了一系列可复用的组合式函数（Composables），提供常用功能。

useNavbar

导航栏高度计算，支持微信小程序胶囊按钮避让。

import { useNavbar } from "@/composables/useNavbar"

const { totalHeight, contentPaddingTop, menuButtonRightGap } = useNavbar()

useCountdown

倒计时功能，常用于验证码发送。

const { countdown, isRunning, start, stop } = useCountdown(60)

// 开始倒计时
start()

// 停止倒计时
stop()

useNavigation

页面跳转封装，统一处理登录检查和外部链接。

const { handleNavClick } = useNavigation()

// 在模板中使用
handleNavClick({ url: '/pages/user/index' })

useRequest

请求状态管理，自动处理 loading 和错误。

const { data, loading, error, execute } = useRequest(
  () => UserAPI.getUserInfo()
)

// 手动执行
await execute()

// 立即执行
const { data } = useRequest(() => UserAPI.getUserInfo(), { immediate: true })

useLoading

全局 loading 状态管理，支持并发计数。

const { isLoading, start, stop, wrap } = useLoading()

start('加载中...')
await fetchData()
stop()

// 包装异步函数
const result = await wrap(fetchData())

useTabbar

TabBar 配置和状态管理。

const { tabbarList, setTabbarItemActive, setTabbarItem } = useTabbar()

// 切换到工作台
setTabbarItemActive('work')

// 设置徽标数字
setTabbarItem('work', 5)

useTheme

主题切换功能，支持明暗模式和主题色。

const { isDark, currentThemeColor, toggleTheme, setThemeColor } = useTheme()

// 切换明暗模式
toggleTheme()

// 设置主题色
setThemeColor({ name: '蓝色', color: '#4d80f0' })

useSse

SSE 实时通信封装，用于接收服务端推送事件。

const { isConnected, connect, disconnect, on } = useSse()

// 连接
connect()

// 订阅事件
const unsubscribe = on('dict', (data) => {
  console.log('字典变更:', data)
})

// 取消订阅
unsubscribe()

// 断开连接
disconnect()

详细用法参见 实时通信。