智能小程序 Ray 开发面板 SDK —— 智能设备模型 Hooks SDK 汇总（四）

useBuiltInAlarm

如果尚未了解 Hooks，请先查阅 React Hooks 官方文档 了解相关概念

useBuiltInAlarm 基于 sdm 及 alarm-ability 实现，提供了设备内置告警的调用方法，并能够在告警列表状态发生变化时驱动组件重新渲染。

⚠️ 使用前请注意检查项目是否已挂载了 SdmProvider，项目接入可参考 智能设备模型 - 使用，全新项目可直接基于 public-sdm 示例项目进行开发。

⚠️ 使用前请注意检查是否已配置接入了 SmartAlarmAbility，项目接入可参考 告警推送 - 使用。

代码演示

基础用法

import React from 'react';
import { View } from '@ray-js/ray';
import { useBuiltInAlarm } from '@ray-js/panel-sdk';
import { AlarmList } from '@ray-js/api/lib/cloud/interface';
import TyList from '@ray-js/components-ty-cell';
import TySwitch from '@ray-js/components-ty-switch';
 
function PageSdmAlarm() {
  const { loading, data, getBuiltInAlarmList, setBuiltInAlarmStatus } = useBuiltInAlarm();
 
  React.useEffect(() => {
    // 在页面挂载完毕时加载内置告警列表
    getBuiltInAlarmList();
  }, []);
 
  const handleValueChange = React.useCallback(
    (item: AlarmList) => (value: boolean) => {
      setBuiltInAlarmStatus({ disabled: !value, ruleIds: item.id });
    },
    []
  );
 
  const rowKey = React.useCallback((item: AlarmList) => item.id, []);
 
  console.log('=== rerender builtInAlarm', data, loading);
 
  return (
    <View>
      <TyList<AlarmList>
        dataSource={data}
        renderItem={item => (
          <TyList.Item
            key={item.id}
            title={item.name}
            content={<TySwitch checked={item.enabled} onChange={handleValueChange(item)} />}
          />
        )}
        rowKey={rowKey}
      />
    </View>
  );
}

👉 立即免费领取开发资源，体验涂鸦 MiniApp 小程序开发。 

API

ℹ️ 由于部分类型较为复杂，本文仅列出了部分重要的属性，如有需要可查看更多信息中 alarm 模块文档。

declare type Result = {
  /**
   * 设备内置的告警列表信息
   */
  data: AlarmList[];
  /**
   * 设备内置的告警列表信息是否正在加载中
   */
  loading: boolean;
  /**
   * 根据设备 id 查询该设备内置的告警列表信息
   *
   * @param {string} devId - 设备 id
   */
  getBuiltInAlarmList: (devId?: string) => Promise<AlarmList[]>;
  /**
   * 根据设备 id 启用或禁用该设备内置的告警
   *
   * @param {Object} options - 设置内置告警状态的选项对象。
   * @param {string} options.devId - 设备 ID。
   * @param {boolean} options.disabled - 是否禁用告警。
   * @param {string} options.ruleIds - 告警规则 ID 数组，用逗号分隔，如：'ruleId1,ruleId2'。
   */
  setBuiltInAlarmStatus: (params: ISetAlarmSwitch) => Promise<boolean>；
};
 
export declare function useBuiltInAlarm(): Result;

Result

属性	数据类型	说明
data	AlarmList[]	设备内置的告警列表信息
loading	boolean	设备内置的告警列表信息是否正在加载中
getBuiltInAlarmList	(devId?: string) => Promise<AlarmList[]>	根据设备 id 查询该设备内置的告警列表信息
setBuiltInAlarmStatus	(params: ISetAlarmSwitch) => Promise<boolean>	根据设备 id 启用或禁用该设备内置的告警

Params

无

更多信息参考：

• SDM#model.abilities
• alarm#getBuiltInAlarmList
• alarm#setBuiltInAlarmStatus

useSupport

如果尚未了解 Hooks，请先查阅 React Hooks 官方文档 了解相关概念

useSupport 基于 sdm 及 support-ability 实现，一个 hooks 版本的设备支持状态。

⚠️ 使用前请注意检查项目是否已挂载了 SdmProvider，项目接入可参考 智能设备模型 - 使用，全新项目可直接基于 public-sdm 示例项目进行开发。

⚠️ 使用前请注意检查是否已配置接入了 SmartSupportAbility，项目接入可参考 通用能力 - 使用。

代码演示

基础用法

import React from 'react';
import { View, Text } from '@ray-js/ray';
import { useSupport } from '@ray-js/panel-sdk';
 
function PageSdmSupport() {
  const support = useSupport();
  return (
    <View>
      <Text>{support.isSupportCloudTimer() ? '支持云定时' : '不支持云定时'}</Text>
    </View>
  );
}

API

export declare function useSupport<T extends DpSchema[]>(): SmartSupportAbility<T>;

Result

详见 SmartSupportAbility API。

Params

无

👉 立即免费领取开发资源，体验涂鸦 MiniApp 小程序开发。