前面介紹了有限狀態(tài)機(jī)的狀態(tài)和轉(zhuǎn)換，具體界面響應(yīng)是在狀態(tài)轉(zhuǎn)換時進(jìn)行的似忧，比如如果用戶按了按鈕，某些控件會不可見丈秩，這些動作需要在狀態(tài)轉(zhuǎn)換時的事件響應(yīng)中完成盯捌，在狀態(tài)轉(zhuǎn)換時，會有有五種事件發(fā)生蘑秽，按順序如下：
onBeforeTransition - 轉(zhuǎn)換發(fā)生前事件
onLeaveState - 離開上一個狀態(tài)的事件
onTransition - 轉(zhuǎn)換進(jìn)行種的事件
onEnterState - 進(jìn)入下一個狀態(tài)的事件
onAfterTransition - 轉(zhuǎn)換完成后的事件
這些事件針對所有的狀態(tài)和轉(zhuǎn)換饺著，如果針對特定的事件和轉(zhuǎn)換，可以將上面的函數(shù)種的Transition和State換為具體的名稱：onBefore<TRANSITION> - 特定轉(zhuǎn)換發(fā)生前的事件
onLeave<STATE> - 離開特定狀態(tài)的事件
onEnter<STATE> - 進(jìn)入特定狀態(tài)的事件
onAfter<TRANSITION> - 特定轉(zhuǎn)換完成的事件
還有兩種簡化的寫法：
- onAfter<TRANSITION>可以簡化為on<TRANSITION>
- onEnter<STATE> 可以簡化為on<STATE>
這些名稱需要使用javascript的駝峰命名方式肠牲，不管狀態(tài)和轉(zhuǎn)移如何定義登下，下面是例子：
var fsm = new StateMachine({
transitions: [
{ name: 'do-with-dash', from: 'has-dash', to: 'has_underscore' },
{ name: 'do_with_underscore', from: 'has_underscore', to: 'alreadyCamelized' },
{ name: 'doAlreadyCamelized', from: 'alreadyCamelize', to: 'has-dash' }
],
methods: {
onBeforeDoWithDash: function() { /* ... */ },
onBeforeDoWithUnderscore: function() { /* ... */ },
onBeforeDoAlreadyCamelized: function() { /* ... */ },
onLeaveHasDash: function() { /* ... */ },
onLeaveHasUnderscore: function() { /* ... */ },
onLeaveAlreadyCamelized: function() { /* ... */ },
onEnterHasDash: function() { /* ... */ },
onEnterHasUnderscore: function() { /* ... */ },
onEnterAlreadyCamelized: function() { /* ... */ },
onAfterDoWithDash: function() { /* ... */ },
onAfterDoWithUnderscore: function() { /* ... */ },
onAfterDoAlreadyCamelized: function() { /* ... */ }
}
});
