---
title: SDM 智能设备模型概览 - 基于 OOP 的面板标准开发范式与 DP 上报下发
summary: SDM（Smart Device Model）是 @ray-js/panel-sdk 提供的基于 OOP 的面板小程序开发库，封装了设备数据管理、设备控制、状态监听及差异抹平。快速上手：在 Tuya MiniApp IDE 选择 SDM 通用模板创建项目，通过 useProps 获取 DP 值（未配置 protocols 时获取原始值）、useStructuredProps 获取结构化值（需配置 protocols），通过 useActions 下发 DP（未配置 protocols）、useStructuredActions 下发结构化 DP（需配置 protocols）。支持 Ray/React 项目。
questions:
  - SDM 智能设备模型是什么，如何通过 OOP 方式封装设备数据管理、控制和状态监听？
  - 如何在 Tuya MiniApp IDE 中选择 SDM 通用模板创建新项目？
  - useProps 获取 DP 值时，配置了 protocols 和未配置 protocols 的返回结果有什么区别？
  - useActions 和 useStructuredActions 在 DP 下发时分别适用于什么场景（原始值 vs 结构化值）？
  - SDM 标准开发范式包含哪些步骤（创建项目、创建页面、DP 上报与下发）？
  - SDM 模型对不同协议设备（WiFi、蓝牙、Zigbee 等）的差异抹平体现在哪些方面？
  - 如何通过 yarn add @ray-js/panel-sdk 安装并开始使用 SDM？
  - SDM 与直接使用小程序 API 开发面板相比有哪些优势？
  - SDM 是否同时支持 Ray 框架和 React 项目？
  - SDM 的 Hooks、拦截器、状态管理等子模块分别解决什么问题？
---

# 智能设备模型

当前面板小程序提供了大量丰富且灵活的 API，要搞清楚如何调用组合它们对于新手来说具有一定挑战性，因此我们提供了智能设备模型（SDM）。

<Image src='/images/panel/sdm-intro.png' style={{ width: '375px' }}/>

简单来说，它是一个基于 OOP 的面板小程序开发库，通过对设备的数据管理，设备控制，状态监听的封装以及差异抹平，让您在面板开发的过程中能减少过多细节的关注，使用一套标准的开发范式进行高效开发。

## 如何使用

1. 在 [Tuya MiniApp IDE](/cn/miniapp/devtools/tools) （如果未使用过，请跳转链接查看具体用法）中创建项目，选择模板时注意选择 **SDM 通用模板** 。
2. 运行项目，在 `pages` 下创建新页面
3. DP 下发与上报监听获取

- 获取最新的 DP 值（DP 值没有配置 [protocols](/cn/miniapp/solution-panel/ability/common/sdm/interceptors/dpkit/usage)） => `const power = useProps((props) => props.power);`
- 获取最新的 DP 值（DP 值有配置 [protocols](/cn/miniapp/solution-panel/ability/common/sdm/interceptors/dpkit/usage)）=> `const power = useProps((props) => props.power);`
- 修改 DP 值（DP 值没有配置 [protocols](/cn/miniapp/solution-panel/ability/common/sdm/interceptors/dpkit/usage)） => `const actions = useActions();`
- 修改 DP 值（DP 值有配置 [protocols](/cn/miniapp/solution-panel/ability/common/sdm/interceptors/dpkit/usage)） => `const actions = useStructuredActions();`

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

# or

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

<Image src='/images/panel/sdm.gif'/>

> Ray / React 项目

<Image src='/images/panel/sdm-react.gif'/>