sproutcore - 如何在 Sproutcore 中离开状态？

Question

怎么可能在 Sproutcore 中留下一个状态？实际上，我正在寻找相当于：

MyApp.statechart.gotoState('StateA');

是否有另一种方法可以手动离开状态而不是通过substatesAreConcurrent: NO属性控制它？例如：StateA 和 StateB 是并发的。StateB 有两个嵌套的子状态：StateBa 和 StateBb。当我从 StateBa 切换到 StateBb 时，我想离开 StateA。这怎么可能？

先感谢您！

Answer 1

给定一个状态图：

App.statechart = SC.Statechart.create({

   substatesAreConcurrent: YES,

   stateA: SC.State.extend({
   }),

   stateB: SC.State.extend({

      initialSubstate: 'stateBa'

      stateBa: SC.State.extend({
      }),

      stateBb: SC.State.extend({
      })

   })

});

您的应用程序同时在 stateA 和 stateB 内。为了在从 stateBa->stateBb 转换时从 stateA 转换到其他状态，我们必须如下增强 stateA：

   stateA: SC.State.extend({

      initialSubstate: 'stateAa',

      stateAa: SC.State.extend({
      }),

      stateAb: SC.State.extend({
      })

   }),

实现这一点的惯用方法是在两种状态下处理相同的事件，比如“更改”，如下所示：

App.statechart = SC.Statechart.create({

   substatesAreConcurrent: YES,

   stateA: SC.State.extend({

      initialSubstate: 'stateAa',

      stateAa: SC.State.extend({

         change: function() {
            this.gotoState('stateAb');
         }

      }),

      stateAb: SC.State.extend({
      })

   }),

   stateB: SC.State.extend({

      initialSubstate: 'stateBa'

      stateBa: SC.State.extend({

         change: function() {
            this.gotoState('stateBb');
         }

      }),

      stateBb: SC.State.extend({
      })

   })

});

这样，发送“更改”事件会导致两个并发状态的状态转换。但是，如果您有兴趣离开并发，您可以像这样增强您的状态图：

App.statechart = SC.Statechart.create({

   stateSuperA: SC.State.extend({
      substatesAreConcurrent: YES,

      stateA: SC.State.extend({

         initialSubstate: 'stateAa',

         stateAa: SC.State.extend({

            change: function() {
               this.gotoState('stateAb');
            }

         }),

         stateAb: SC.State.extend({

            join: function() {
               this.gotoState('stateSuperB');
            }

         })

      }),

      stateB: SC.State.extend({

         initialSubstate: 'stateBa'

         stateBa: SC.State.extend({

            change: function() {
               this.gotoState('stateBb');
            }

         }),

         stateBb: SC.State.extend({
         })

      })

   }),

   stateSuperB: SC.State.extend({
   })

});

在收到上面的“加入”事件后，您的应用程序将不再处于并发子状态，而只是处于 stateSuperB。