---
title: 面板业务 Hooks 集合 - usePanelConfig、useScreenAlwaysOn、useTopBarTitle 等常用 React Hooks
summary: "@ray-js/panel-sdk 提供的面板业务 React Hooks 方法集合，包括 usePanelConfig（面板配置）、useScreenAlwaysOn（屏幕常亮）、useTopBarTitle（动态设置顶部标题）、useIsSigmeshGatewayConnected（SigMesh 网关连接状态判断）、useProtocolRun（根据设备协议类型执行不同逻辑）等，通过 yarn add @ray-js/panel-sdk 安装后从包中直接导入使用。"
questions:
  - "@ray-js/panel-sdk 提供了哪些面板业务 React Hooks（usePanelConfig、useScreenAlwaysOn、useTopBarTitle 等）？"
  - usePanelConfig Hook 的作用是什么，如何获取面板配置信息？
  - useScreenAlwaysOn 如何实现面板页面屏幕常亮，适用于什么场景？
  - useTopBarTitle 如何动态设置小程序顶部标题栏文字？
  - useIsSigmeshGatewayConnected 用于判断 SigMesh 网关的什么连接状态？
  - useProtocolRun 如何根据设备协议类型（WiFi、蓝牙等）执行不同的业务逻辑？
  - 如何通过 yarn add @ray-js/panel-sdk 安装并从中导入这些 Hooks？
  - 这些 Hooks 与 SDM 的 useProps、useActions 等 Hooks 是什么关系？
  - 面板业务 Hooks 是否必须在 React 函数组件中调用？
  - 这些 Hooks 在不同品类的设备面板开发中是否通用？
---

# Hooks

Hooks 指的是一系列可能在您开发控制设备面板业务的时候需要用到的 React Hooks 方法集合，我们在 @ray-js/panel-sdk 中做了一层包装，帮助您更方便的开发智能产品。

## 如何使用

```shell
$ yarn add @ray-js/panel-sdk

# or

$ npm install @ray-js/panel-sdk
```

then

```javascript
import {
  usePanelConfig,
  useScreenAlwaysOn,
  useTopBarTitle,
  useIsSigmeshGatewayConnected,
  useProtocolRun,
} from '@ray-js/panel-sdk';
```