时间戳

首页 > 解决方案 > 架构问题 - 使用子路由与组件

ember.js - 架构问题 - 使用子路由与组件

问题描述

我正在尝试构建一个 UI，左侧栏有过滤器，右侧有实际过滤数据。对于将数据加载到 UI 的动态部分（右侧），哪种方法在代码质量和应用程序性能方面被认为更好？

标签： ember.jsarchitecture

解决方案

对此没有直接的正确答案；你可以同时使用这两种方式，但这里有一些事情需要考虑，最后我通常更喜欢使用子路由，原因如下：

  1. 等待 UI 加载：如果您使用单独的组件来加载自己的数据；那么你需要处理组件的加载状态。我的意思是; 如果您只是使用子路线；然后模型钩子（model,beforeModel等）将在显示数据之前等待承诺得到解决。如果您只是提供一个加载模板（详情请参阅指南），它将默认显示。如果您使用组件，您可能需要处理显示覆盖/微调器以提供更好的用户体验。
  2. 错误处理：类似加载状态管理；Ember 已经内置了对路由挂钩方法期间错误处理的支持。如果您更喜欢组件来进行远程调用，您将需要自己处理。（详见指南）
  3. 应用状态： Ember 是 SPA 框架；将应用程序状态与 URL 同步是常见的做法。如果您使用子路由；您可以简单地使用查询参数（详细信息请参阅指南），您将能够与其他人共享 URL，并且应用程序将以相同的状态加载。对组件做同样的事情有点棘手。您仍然需要在路由中使用查询参数并将参数传递给组件来执行此操作。
  4. 使用组件挂钩方法：如果您打算使用组件，那么您很可能需要使用组件挂钩方法以默认filter值打开应用程序。这意味着您将需要在一个或多个组件挂钩方法中init对服务器进行一些远程调用。我个人不喜欢在这些方法中进行远程调用；因为我觉得这应该更好地在路由中完成，并且应该将数据传递给组件；但这是我个人对编码的品味，你应该以不同的方式处理这个案例，这很好。willRenderdidReceiveAttrs

推荐阅读