@ray-js/panel-sdk
v1.10.4
Published
Tuya Mini App Panel SDK
Downloads
694
Readme
English | 简体中文
@ray-js/panel-sdk
Ray Panel Mini App Base JS SDK
Installation
$ npm install @ray-js/panel-sdk
# or
$ yarn add @ray-js/panel-sdk
# or
$ pnpm add @ray-js/panel-sdk
Basic Usage
Fully use
import { kit, hooks, utils, service } from '@ray-js/panel-sdk';
const { I18N } = kit;
// Never use hooks.useDpState, which will cause the eslint rule to fail to detect
const { useDpState } = hooks;
const data = utils.parseJSON('{}');
service.getAssetHostname().then(data => {
console.lo('data: ', data);
});
Smart Device Model
Usage
import { SmartDeviceModel } from '@ray-js/panel-sdk';
// SmartDevices comes from typings/sdm.d.ts,negligible for non Typescript developers
export const devices = {} as SmartDevices;
SmartDeviceModel.init<SmartDeviceSchema>().then(device => {
/**
* It is recommended that the name of the smart device be used as the key name for assignment
*/
devices.robot = device;
});
devices.robot.model.actions.power.toggle();
Ray / React Project
// src/app.tsx
import React from 'react';
import 'ray';
import '@/i18n';
import { kit, SdmProvider } from '@ray-js/panel-sdk';
import { devices } from '@/devices';
const { initPanelEnvironment } = kit;
interface Props {
children: React.ReactNode;
}
initPanelEnvironment({ useDefaultOffline: true });
export default class App extends React.Component<Props> {
onLaunch() {
console.info('=== App onLaunch');
}
render() {
return <SdmProvider value={devices.robot}>{this.props.children}</SdmProvider>;
}
}
// src/pages/home/index.tsx
import React from 'react';
import { Button, View } from '@ray-js/ray';
import { devices } from '@/devices';
export default function Home() {
const device = devices.robot;
return (
<View>
<Button onClick={() => device.model.actions.power.toggle()}>Click me toggle power</Button>
</View>
);
}