如何在单击按钮时路由到视图(ExtJS 6.2)

Ext.application({
  name: 'MyApp',

  launch: function() {
    // 创建路由器实例
    var router = Ext.create('Ext.route.Router');

    // 设置路由规则
    router.connect('home', {
      controller: 'home',
      action: 'index'
    });

    // 启动应用程序
    Ext.Viewport.add(Ext.create('MyApp.view.Main'));
  }
});

Ext.define('MyApp.view.Home', {
  extend: 'Ext.Panel',
  xtype: 'home',

  items: [{
    xtype: 'button',
    text: 'Go to Another View',
    handler: function() {
      // 通过路由器导航到指定的视图
      Ext.route.Router.redirectTo('another');
    }
  }]
});

Ext.define('MyApp.view.Another', {
  extend: 'Ext.Panel',
  xtype: 'another',

  // 视图的配置项...

  // ...

  // 路由规则
  routes: {
    'another': 'showAnotherView'
  },

  // 路由处理方法
  showAnotherView: function() {
    Ext.Viewport.setActiveItem(this);
  }
});

// 在应用程序的启动方法中添加路由规则
router.connect('another', {
  controller: 'another',
  action: 'showAnotherView'
});