基础
原生方法
跳转面板定时页
之前：
TYSdk.native.gotoDpAlarm(params);
现在：
详见 openTimerPage
import { openTimerPage } from '@ray-js/ray';
openTimerPage({
deviceId: device_id,
category: 'category',
data:[
{
dpName: '开关1',
dpId: '1',
rangeKeys:["open","close"],
rangeValues:["开","关"]
}
],
success: (res) => {
console.log('success',res);
}
})
跳转设备详情页
之前：
TYSdk.native.showDeviceMenu()
现在：
详见 openDeviceDetailPage
获取设备蓝牙信息
之前：
TYSdk.native.getBTInfo('YOUR_DEVICE_ID')
.then(data => console.log('data: ', data))
.catch(err => console.log('err: ', err));
现在：
详见 getBTDeviceInfo
打开蓝牙配对弹窗（安卓）
之前：
TYSdk.native.createBTbond('YOUR_DEVICE_MAC')
.then(data => console.log('data: ', data))
.catch(err => console.log('err: ', err));
现在：
详见 connectBTBond
移除蓝牙连接（安卓）
之前：
TYSdk.native.removeBTbond()
现在：
详见 disconnectBTBond
打开系统设置页面（iOS）
之前：
TYSdk.native.jumpToSettingPage();
现在：
详见 openSystemSettingPage
移动方法
返回 App 列表
之前：
现在：
详见 exitMiniProgram
显示底部对话列表【废弃】
已废弃，建议使用前端 UI 组件，如 SmartUI 的 ActionSheet 替代实现
禁用手势全屏返回【废弃】
已废弃
开启手势全屏返回【废弃】
已废弃
获取客户端信息
之前：
TYSdk.mobile.getMobileInfo();
现在：
可配合 getSystemInfo 及 getMobileDeviceInfo 获取客户端信息
获取网络状态
之前：
TYSdk.mobile.getNetworkState();
现在：
详见 getNetworkType，如需获取设备某个通道是否在线，可使用 getDeviceOnlineType
显示 loading UI 框
之前：
TYSdk.mobile.showLoading();
现在：
详见 showLoading
隐藏 loading UI 框
之前：
TYSdk.mobile.hideLoading();
现在：
详见 hideLoading
检测时间制
之前：
TYSdk.mobile.is24Hour()
.then(data => {
console.log('data :>> ', data);
})
.catch(error => {
console.log('error :>> ', error);
});
现在：
详见 getSystemInfo 中的 is24Hour 返回值
跳转二级页面
跳转至已存在场景
之前：
TYSdk.mobile.jumpTo('tuyasmart://xxxUrl');
现在：
Warning
原先 RN 中的部分场景已不再建议使用，若存在面板小程序中无法找到对应的短链，请前往 论坛社区 描述您的具体需求和场景，我们安排评估支持。
编辑对话框【废弃】
已废弃，建议使用前端 UI 组件，如 SmartUI 的 Dialog 弹出框 替代实现
轻量级对话【废弃】
已废弃，建议使用前端 UI 组件，如 SmartUI 的 Dialog 弹出框 替代实现
简易确认对话框
之前：
TYSdk.mobile.simpleConfirmDialog(title, msg, onConfirmed, onCanceled);
现在：
详见 showModal
简易提示框
之前：
TYSdk.mobile.simpleTipDialog(msg, onConfirmed);
现在：
详见 showModal，如将 showCancel 入参设置为 false
设备方法
下发 dp 点状态 / 下发局域网内 dp 点状态
之前：
TYSdk.device.putDeviceData({ switch_1: true });
// or
TYSdk.device.putLocalDpData({ switch_1: true });
现在：
import { publishDps } from '@ray-js/ray';
await publishDps({ switch_1: true });
但我们更推荐使用智能设备模型中配套的 useActions Hooks 进行 dp 点下发，详见 useActions
import React from 'react';
import { View } from '@ray-js/ray';
import { useProps, useActions } from '@ray-js/panel-sdk';
export default function Home() {
const switch_1 = useProps(props => props.switch_1);
const actions = useActions();
return (
<View
style={{ flex: 1 }}
onClick={() => {
actions.switch_1.toggle();
}}
>
<View>socket.switch_1: {switch_1}</View>
</View>
);
}
获取设备状态信息
之前：
TYSdk.device.getDeviceState()
.then(data => {
console.log('data :>> ', data);
})
.catch(error => {
console.log('error :>> ', error);
});
现在：
详见 useProps
Warning
getDeviceState 只会获取当前的设备状态信息，而 useProps 会在设备状态变更时自动驱动刷新
因此除非当前页面或组件需要监听所有功能点的变化，否则请勿使用该方式，会导致当前页面或组件出现性能问题，频繁进行无效的重复渲染。
import React from 'react';
import { View } from '@ray-js/ray';
import { useProps } from '@ray-js/panel-sdk';
export default function Home() {
const dpState1 = useProps();
const dpState2 = useProps(props => props);
return (
<View style={{ flex: 1 }}>
<View>dpState1: {JSON.stringify(dpState1)}</View>
<View>dpState2: {JSON.stringify(dpState2)}</View>
</View>
);
}
检查 dp 是否存在
之前：
TYSdk.device.checkDpExist(idOrCode);
// 若输入 dpCode 则返回 dpId
const data = TYSdk.device.checkDpExist('switch_1');
// 若输入 dpId 则返回 dpCode
const data = TYSdk.device.checkDpExist('1');
console.log('data: ', data);
现在：
详见 useDevice
import React from 'react';
import { View } from '@ray-js/ray';
import { useDevice } from '@ray-js/panel-sdk';
export default function Home() {
const isSwitchExist1 = useDevice(device => typeof device.devInfo.codeIds.switch_1 !== 'undefined');
const isSwitchExist2 = useDevice(device => typeof device.devInfo.idCodes[1] !== 'undefined');
return (
<View style={{ flex: 1 }}>
<View>isSwitchExist1: {isSwitchExist1}</View>
<View>isSwitchExist2: {isSwitchExist2}</View>
</View>
);
}
获取设备信息
之前：
TYSdk.device.getDeviceInfo()
.then((data: DevInfo) => {
console.log('data :>> ', data);
})
.catch(error => {
console.log('error :>> ', error);
});
现在：
方式一：通过 getDeviceInfo 获取，详见 getDeviceInfo
import { device } from '@ray-js/ray';
const { getDeviceInfo } = device;
getDeviceInfo({
deviceId: 'vdevxxxxx',
})
.then((res) => {
console.log(res);
})
.catch((error) => {
console.log(error);
});
方式二：通过 SDM 的 Hooks，详见 useDevice
import React from 'react';
import { View } from '@ray-js/ray';
import { useDevice } from '@ray-js/panel-sdk';
export default function Home() {
const devInfo = useDevice(device => device.devInfo);
return (
<View style={{ flex: 1 }}>
<View>devInfo: {devInfo}</View>
</View>
);
}
获取 dpCode
之前：
TYSdk.device.getDpCodeById('22');
现在：
详见 useDevice
import { View } from '@ray-js/ray';
import { useDevice } from '@ray-js/panel-sdk';
export default function Home() {
const switchCode = useDevice(device => device.devInfo.idCodes[22]);
return (
<View style={{ flex: 1 }}>
<View>switchCode: {switchCode}</View>
</View>
);
}
获取 dpCodes
之前：
TYSdk.device.getDpCodes();
现在：
详见 useDevice
import { View } from '@ray-js/ray';
import { useDevice } from '@ray-js/panel-sdk';
export default function Home() {
const dpCodes = useDevice(device => device.devInfo.idCodes);
return (
<View style={{ flex: 1 }}>
<View>dpCodes: {dpCodes}</View>
</View>
);
}
获取 dp 点状态
之前：
TYSdk.device.getDpDataFromDevice(idOrCode)
.then(data => {
console.log('data :>> ', data);
})
.catch(error => {
console.log('error :>> ', error);
});
现在：
详见 queryDps
获取 dpId
之前：
TYSdk.device.getDpIdByCode('bright_value');
现在：
详见 useDevice
import React from 'react';
import { View } from '@ray-js/ray';
import { useDevice } from '@ray-js/panel-sdk';
export default function Home() {
const brightId = useDevice(device => device.devInfo.codeIds.bright_value);
return (
<View style={{ flex: 1 }}>
<View>brightId: {brightId}</View>
</View>
);
}
获取 schema 信息
之前：
TYSdk.device.getDpSchema(dpCode);
// 获取开关 switch_1 的 Schema 信息
const data = TYSdk.device.getDpSchema('switch_1');
console.log('data: ', data);
现在：
详见 useDevice
import React from 'react';
import { View } from '@ray-js/ray';
import { useDevice } from '@ray-js/panel-sdk';
export default function Home() {
const dpSchema = useDevice((device) => device.dpSchema);
return (
<View style={{ flex: 1 }}>
<View>device dpSchema: {JSON.stringify(dpSchema)}</View>
</View>
);
}
获取 dp 的 value 值
之前：
TYSdk.device.getState(idOrCode);
现在：
详见 useProps
Warning
getState 只会获取当前的设备状态，而 useProps 会在指定的设备功能点状态变更时自动驱动视图刷新
import React from 'react';
import { View } from '@ray-js/ray';
import { useProps } from '@ray-js/panel-sdk';
export default function Home() {
const power = useProps((props) => props[idOrCode]);
return (
<View style={{ flex: 1 }}>
<View>power: {power}</View>
</View>
);
}
是否是蓝牙设备 / 设备共享 / SigMesh 设备 / 无线 Wi-Fi 设备
之前：
TYSdk.device.isBleDevice();
TYSdk.device.isShareDevice();
TYSdk.device.isSigMeshDevice();
TYSdk.device.isWifiDevice();
现在：
详见 useSupport
import React from 'react';
import { View, Text } from '@ray-js/ray';
import { useSupport, useDevice } from '@ray-js/panel-sdk';
function PageSdmSupport() {
const support = useSupport();
const isShareDevice = useDevice(device => device.devInfo.isShare);
return (
<View>
<Text>{support.isBleDevice() ? 'BLE Device' : 'Other Device'}</Text>
<Text>{isShareDevice ? 'Share Device' : 'Other Device'}</Text>
<Text>{support.isSigMeshDevice() ? 'SigMesh Device' : 'Other Device'}</Text>
<Text>{support.isWifiDevice() ? 'Wi-Fi Device' : 'Other Device'}</Text>
</View>
);
}
请求接口
之前：
TYSdk.apiRequest(a, postData, version)
.then(data =>
console.log('data',data);
)
.catch(error =>
console.log('error',error);
);
现在：
- 请求涂鸦内部服务的通用 API 已被废弃，如需调用特定的开放接口，可参考 开放接口 部分
- 但我们开放了 request API，能够支持调用第三方服务接口
事件方法
deviceDataChange
之前：
const handleDeviceDataChange = (data) => {
// 设备状态变更通知，payload 为更新的 DP 状态
if (data.type === 'dpData') {
console.log('dpData event', data.payload);
}
// 设备信息变更通知，payload 为 devInfo
if (data.type === 'devInfo') {
console.log('devInfo event', data.payload);
}
// deviceOnline 设备是否在线通知，payload 为 boolean
if (data.type === 'deviceOnline') {
console.log('deviceOnline event', data.payload);
}
};
TYSdk.event.on('deviceDataChange', handleDeviceDataChange);
TYSdk.event.off('deviceDataChange', handleDeviceDataChange);
现在：
- 设备状态变更通知：即 data.type === 'dpData'，参考下述 API
- 设备信息变更通知：即 data.type === 'devInfo'，参考下述 API
- 设备是否在线通知：即 data.type === 'deviceOnline'，参考下述 API
networkStateChange
之前：
TYSdk.event.on('networkStateChange', yourHandler);
TYSdk.event.off('networkStateChange', yourHandler);
现在：
linkageTimeUpdate
之前：
TYSdk.event.on('linkageTimeUpdate', yourHandler);
TYSdk.event.off('linkageTimeUpdate', yourHandler);
现在：
deviceLocalStateChange
之前：
TYSdk.event.on('deviceLocalStateChange', yourHandler);
TYSdk.event.off('deviceLocalStateChange', yourHandler);
现在：
bluetoothChange
之前：
TYSdk.event.on('bluetoothChange', yourHandler);
TYSdk.event.off('bluetoothChange', yourHandler);
现在：
NAVIGATOR_ON_WILL_FOCUS / NAVIGATOR_ON_DID_FOCUS
之前：
TYSdk.event.on('NAVIGATOR_ON_WILL_FOCUS', yourHandler);
TYSdk.event.off('NAVIGATOR_ON_WILL_FOCUS', yourHandler);
现在：
详见 usePageEvent 中的 onShow 和 onLoad 事件。
获取设备信息
之前：
console.log('TYSdk.devInfo: ', TYSdk.devInfo);
现在：
Info
面板小程序相比 RN 面板预留了设备多控的能力，比如我们可以在小程序中监听多个设备的状态或控制多个设备，因此设备信息的获取方式会有所区别，不再支持直接从常量里获取。
方式一：通过 getDeviceInfo 获取，详见 getDeviceInfo
import { device } from '@ray-js/ray';
const { getDeviceInfo } = device;
getDeviceInfo({
deviceId: 'vdevxxxxx',
})
.then((res) => {
console.log(res);
})
.catch((error) => {
console.log(error);
});
方式二：通过 SDM 的 Hooks，详见 useDevice
import React from 'react';
import { View } from '@ray-js/ray';
import { useDevice } from '@ray-js/panel-sdk';
export default function Home() {
const devInfo = useDevice(device => device.devInfo);
return (
<View style={{ flex: 1 }}>
<View>devInfo: {devInfo}</View>
</View>
);
}