Controler un number via checkbox
Bonjour à tous,
Je viens de me mettre à TS et j'avoue que je suis un peu perdu...
J'ai une pompe que je pilote via un automate en PWM. J'ai donc une parametre pomp_speed : number pour contrôler la vitesse de ma pompe.
J'utilise un websocket pour mettre à jour en temps réel la vitesse de mon pompe.
J'aimerai rajouter un switch pour mettre à pompe à 100% ou l'arrêter (mode manuel). Je souhaiterai également que ce switch se mette à jour en fonction de l'état de la pompe (marche ou arrêt)
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
| import { FC, useState } from 'react';
import { DeviceState } from '../types';
const DeviceStateWebSocketForm: FC = () => {
const { connected, updateData, data } = useWs<DeviceState>(DEVICE_STATE_WEBSOCKET_URL);
const [pumpOn, setPumpOn] = useState<boolean>(false);
const updateFormValue = updateValue(updateData);
const handlePumpOn = (event: React.ChangeEvent<HTMLInputElement>) => {
setPumpOn(event.target.checked);
};
const content = () => {
if (!connected || !data) {
return (<FormLoader message="Connecting to WebSocket…" />);
}
return (
<>
<Switch
name="valve_on"
checked={data.valve_on}
onChange={updateFormValue}
/>
<Switch
name="pump_on"
checked={pumpOn}
onChange={handlePumpOn}
</>
);
}; |
avec type.ts
Code:
1
2
3
4
| export interface DeviceState {
valve_on: boolen;
pump_speed: number;
} |
Jusque là tout va bien.
Mais je souhaiterai que si pump_on=true alors pump_speed=100 et inversement si pump_speed>0 alors pump_on=true que cela soit synchronisé par updateFormValue
Si quelqu'un peut m'aider, je l'en remercie par avance ;)
