0.0.3 • Published 6 months ago
@ray-js/multi-socket-switch v0.0.3
English | 简体中文
@ray-js/multi-socket-switch
用于排插品类设备处理开关,可支持单开及总开能力
Installation
$ npm install @ray-js/multi-socket-switch
# or
$ yarn add @ray-js/multi-socket-switch
Usage
Basic usage
import MultiSocketSwitch from '@ray-js/multi-socket-switch';
export default () => (
<MultiSocketSwitch
style={{ width: 200 }}
switchList={[
{ dpCode: 'swith_1', dpValue: true },
{ dpCode: 'swith_2', dpValue: true },
{ dpCode: 'swith_3', dpValue: false },
]}
usbData={[
{ dpCode: 'usb_1', dpValue: true },
{ dpCode: 'usb_2', dpValue: false },
]}
deviceId="123456"
/>
);
Multiple column usage
import MultiSocketSwitch from '@ray-js/multi-socket-switch';
export default () => (
<MultiSocketSwitch
style={{ width: 400 }}
switchList={[
{ dpCode: 'swith_1', dpValue: true },
{ dpCode: 'swith_2', dpValue: true },
{ dpCode: 'swith_3', dpValue: false },
{ dpCode: 'swith_4', dpValue: false },
{ dpCode: 'swith_5', dpValue: true },
{ dpCode: 'swith_6', dpValue: false },
]}
usbData={[
{ dpCode: 'usb_1', dpValue: true },
{ dpCode: 'usb_2', dpValue: false },
]}
usbLayout="horizontal"
deviceId="123456"
double
/>
);
Horizontal layout
import MultiSocketSwitch from '@ray-js/multi-socket-switch';
export default () => (
<MultiSocketSwitch
switchList={[
{ dpCode: 'swith_1', dpValue: true },
{ dpCode: 'swith_2', dpValue: true },
]}
usbData={[
{ dpCode: 'usb_1', dpValue: true },
{ dpCode: 'usb_2', dpValue: false },
]}
deviceId="123456"
layout="horizontal"
usbLayout="horizontal"
/>
);
Custom
import MultiSocketSwitch from '@ray-js/multi-socket-switch';
export default () => (
<MultiSocketSwitch.Container style={{ width: 200 }}>
<MultiSocketSwitch.MainSwitch value onClick={() => {}} />
<MultiSocketSwitch.SubSwitch dpCode="switch_1" dpValue onClick={() => {}} />
<MultiSocketSwitch.SubSwitch dpCode="switch_2" dpValue onClick={() => {}} />
<MultiSocketSwitch.SubSwitch dpCode="switch_3" dpValue onClick={() => {}} />
</MultiSocketSwitch.Container>
);
import MultiSocketSwitch from '@ray-js/multi-socket-switch';
export default () => (
<MultiSocketSwitch
style={{ width: 200 }}
switchList={[
{ dpCode: 'swith_1', dpValue: true },
{ dpCode: 'swith_2', dpValue: true },
{ dpCode: 'swith_3', dpValue: false },
]}
usbData={[
{ dpCode: 'usb_1', dpValue: true },
{ dpCode: 'usb_2', dpValue: false },
]}
deviceId="123456"
/>
);
0.0.3
6 months ago
0.0.3-beta-3
6 months ago
0.0.3-beta-2
6 months ago
0.0.3-beta-1
6 months ago
0.0.2
6 months ago