componentDidMount() { this.service.start(); this.transition(this.service.state, "enterPhone"); }
function App () { const [bulbOn, setBulbOn] = useState(false); useEffect(() => { service.onTransition(state => { console.log('Transitioning', state); switch (state.value) { case 'on': setBulbOn(true); break; case 'off': setBulbOn(false); break; case 'broken': setBulbOn(false); break; default: } }); service.start(); }); return ( <div className="App"> <LightBulb checked={bulbOn} /> <section> <button onClick={() => service.send('toggle')} >Turn {bulbOn ? 'Off' : 'On'}</button> <button onClick={() => service.send('break')} >Break Bulb</button> </section> </div> ); }
componentDidMount() { this.service.start(); }