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 函数，但配置文件的代码不同。

这样，我们可以在具有特定功能的多个配置文件设备之间共享相同的 URL。