useStructuredDevicesActions()

版本要求:
@ray-js/panel-sdk≥1.16.0

描述

获取关联设备的结构化功能点操作方法集合,需配合 dp-kit 拦截器使用

参数

无

返回值

类型:DevicesActions
结构化操作方法集合,key 为设备标识,value 为该设备的结构化 actions。
使用方式与单设备 useStructuredActions 一致

引用对象

interfaceDevicesActions
interface DevicesActions {
  [key: string]: {
    set: (value: object, options?: SendDpOption) => Promise<boolean>;
  };
}
typeDpValue功能点值类型,可能为 boolean、number、string
export type DpValue = boolean | number | string;

示例代码

完整链路:配置 dp-kit + 读取 + 下发(以照明 colour_data 为例)

// ---- 1. devices/protocols/index.ts:实例化 parser 并映射到 DP code ----
import { protocols as sdkProtocols } from '@ray-js/panel-sdk';
import { lampSchemaMap } from '../schema';

export const protocols = {
  [lampSchemaMap.colour_data.code]: new sdkProtocols.ColourTransformer(),
  // ColourTransformer.parser()  返回 { hue, saturation, value } → useStructuredDevicesProps 读
  // ColourTransformer.formatter() 接收 { hue, saturation, value } → useStructuredDevicesActions 写
};

// ---- 2. devices/index.ts:创建 dpKit 并注入 SmartDevicesManager ----
import { createDpKit, SmartDevicesManager } from '@ray-js/panel-sdk';
import { protocols } from '@/devices/protocols';

export const dpKit = createDpKit({ protocols });
export const deviceManager = new SmartDevicesManager();

// batchAdd 时注入 dp-kit 拦截器
deviceManager.batchAdd([
  { key: 'lamp1', deviceId: 'xxx_device_id_1', interceptors: dpKit.interceptors },
  { key: 'lamp2', deviceId: 'xxx_device_id_2', interceptors: dpKit.interceptors },
]);

// ---- 3. 页面组件:通过 useStructuredDevicesActions 下发结构化数据 ----
import { View, Text } from '@ray-js/ray';
import { useStructuredDevicesProps, useStructuredDevicesActions } from '@ray-js/panel-sdk';

export default function ColourControl() {
  // 推荐:精确选用需要的状态,避免无关变化引起无意义渲染
  const colourData = useStructuredDevicesProps(props => props.lamp1?.colour_data);
  const actions = useStructuredDevicesActions();

  const setHue = (hue: number) => {
    actions.lamp1?.colour_data.set({ ...colourData, hue });
  };

  return (
    <View onClick={() => setHue(120)}>
      <Text>当前 hue: {colourData?.hue}</Text>
      <Text>点击设置 hue 为 120</Text>
    </View>
  );
}