Sencha Touch - 历史支持

Sencha Touch 具有完整的历史记录支持和深度链接设施。

它具有最简单的后退按钮功能，可以帮助用户在屏幕之间导航，甚至无需刷新页面或应用程序。

它还提供路由功能，帮助用户导航到任何 URL。根据浏览器窗口中提供的 URL，它调用特定函数来执行特定任务。

请查看以下示例以了解后退按钮功能。

此示例显示了嵌套列表，它只不过是列表中的列表，因此当您单击任何列表项时，它会打开另一个列表，并且屏幕顶部会出现一个后退按钮。

对于完整的代码库，您可以检查视图组件部分下的嵌套列表。

路由

最简单的路线示例

Ext.define('MyApp.controller.Main', {
   extend: 'Ext.app.Controller',

   config: {
      routes: {
         login: 'showLogin',
		 'user/:id': 'userId'
      }
   },

   showLogin: function() {
      Ext.Msg.alert('This is the login page');
   },
   userId: function(id) {
      Ext.Msg.alert('This is the login page specific to the used Id provided');
   }
});

在上面的例子中，如果浏览器 URL 是 https://myApp.com/#login 那么函数 showLogin 将被调用。

我们可以在 URL 中提供参数，然后根据特定参数调用该函数。例如，如果 URL 是 https://myApp.com/#user/3，则将调用另一个函数 userId，并且可以在函数内部使用特定 ID。

高级路由

有时我们有一些预先的参数，包括逗号、空格和特殊字符等，如果我们使用上面的编写路由的方式，那么它就不起作用了。为了解决这个问题 Sencha touch 提供了条件路由，我们可以在其中指定参数应该接受什么类型的数据的条件。

Ext.define('MyApp.controller.Main', {
   extend: 'Ext.app.Controller', config: {
      routes: {
         login/:id: {
            action: showLogin, conditions: {':id: "[0-9a-zA-Z\.]+" }      
         }
      },

      showLogin: function() {
         Ext.Msg.alert('This is the login page with specific id which matches criteria');
      }     
   }
});

正如在上面的例子中，我们在条件中给出了正则表达式，它清楚地说明了应该允许什么类型的数据作为 URL 参数。

在不同的设备配置文件之间共享相同的 URL

由于 Sencha touch 提供设备配置文件，因此可以在多个设备上使用相同的应用程序代码，因此不同的配置文件可能对同一 URL 具有不同的功能。

为了解决这个问题，Sencha touch 让我们可以自由地在主控制器中编写路由，并将被调用的函数写入所有配置文件及其特定配置文件中。

Ext.define('MyApp.controller.Main', {
   extend: 'Ext.app.Controller', config: {
      routes: {
         login: 'showLogin'
      }
   },
});
// For phone profile
Ext.define('MyApp.controller.phone.Main, {
   extend: 'MyApp.controller.Main, showLogin: function() {
      Ext.Msg.alert('This is the login page for mobile phone profile');
   }
});
// For tablet profile
Ext.define('MyApp.controller.tablet.Main, {
   extend: 'MyApp.controller.Main,showLogin: function() {
      Ext.Msg.alert('This is the login page for tablet profile');
   }
});

例如，我们有一个具有 showLogin 功能的主控制器，并且我们有两个不同的配置文件（手机/平板电脑）。两个配置文件都具有 showLogin 函数，并具有特定于配置文件的不同代码。