---
title: 通知
description: 接入通知状态，同时避免让 UI 与后端耦合。
order: 20
toc:
  - id: notifications-query
    title: 通知查询
---

## 通知查询 {#notifications-query}

通知以 TanStack Query 作为数据边界：

```tsx
const notifications = useNotifications({
  queryKey: ["notifications"],
  queryFn: loadNotifications,
})
```

返回结果包含未读数量、乐观已读更新、操作执行、重新请求以及等待和错误状态。`AppLayout` 可以直接通过相同查询选项创建通知 Sheet。