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。

打印页面