接口依赖

Database 类型

从 @/types 导入的 Supabase 数据库类型定义，提供完整的数据库结构类型安全：

• 数据表结构定义
• 枚举类型定义
• 函数和存储过程类型
• 视图和关系定义

---

核心客户端方法

useTypedSupabaseClient()

功能：创建类型安全的 Supabase 客户端实例

返回值：SupabaseClient<Database> - 带有完整类型定义的 Supabase 客户端

类型优势：

• 自动补全数据库表名和字段名
• 编译时类型检查避免运行时错误
• 完整的查询结果类型推断

使用场景：所有数据库操作场景，确保类型安全的数据访问

---

用户状态方法

useTypedSupabaseUser()

功能：获取类型安全的当前用户信息

返回值：Ref<User | null> - 当前用户信息的响应式引用

包含信息：

• 用户身份信息（ID、邮箱等）
• 用户元数据
• 应用特定用户属性

使用场景：获取和显示当前登录用户信息，权限判断

---

useTypedSupabaseSession()

功能：获取类型安全的用户会话信息

返回值：Ref<Session | null> - 当前会话信息的响应式引用

包含信息：

• 访问令牌和刷新令牌
• 会话过期时间
• 认证提供商信息

使用场景：会话管理、令牌刷新、认证状态监控

---

实时数据订阅方法

useSupabaseRealtime<T>(tableName, callback)

功能：类型安全的实时数据订阅函数

参数：

• tableName: keyof Database['public']['Tables'] - 要订阅的表名（类型安全）
• callback: (payload: any) => void - 数据变更时的回调函数

返回值：

• unsubscribe: () => void - 取消订阅的函数

订阅事件：

• INSERT: 数据插入操作
• UPDATE: 数据更新操作
• DELETE: 数据删除操作
• *: 所有操作类型

内部机制：

1. 创建命名频道进行数据订阅
2. 监听 PostgreSQL 数据库变更事件
3. 提供自动清理机制防止内存泄漏
4. 支持手动取消订阅控制

使用场景：实时聊天、实时数据看板、协作编辑等需要实时数据同步的场景

---

技术特点

1. 完全类型安全：基于 Database 类型定义提供端到端类型安全
2. 自动补全支持：开发时智能提示表名和字段名
3. 响应式集成：与 Vue 响应式系统完美结合
4. 资源管理：自动清理订阅资源，防止内存泄漏
5. 错误预防：编译时类型检查减少运行时错误
6. 开发效率：减少调试时间，提高开发效率

---

使用建议

• 数据库操作：使用 useTypedSupabaseClient 进行所有数据查询和操作
• 用户状态：使用 useTypedSupabaseUser 获取用户信息，useTypedSupabaseSession 管理会话
• 实时功能：使用 useSupabaseRealtime 实现实时数据同步功能
• 类型安全：充分利用 TypeScript 类型提示避免拼写错误和类型错误
• 资源清理：及时取消不再需要的实时订阅，优化性能

---

最佳实践示例

// 类型安全的数据查询
const client = useTypedSupabaseClient()
const { data: users } = await client
  .from('users')
  .select('id, name, email')
  .eq('status', 'active')

// 实时订阅示例
const { unsubscribe } = useSupabaseRealtime('messages', (payload) => {
  console.log('新消息:', payload.new)
  console.log('旧消息:', payload.old)
  console.log('操作类型:', payload.eventType)
})

// 组件卸载时自动清理
onUnmounted(() => {
  unsubscribe()
})

版权所有

版权归属：Evoliant

许可证：MIT