问题标签 [twitter-flight]

Twitter几天前在 github上发布了他们的Javascript Framework Flight 。根据我收集到的信息，Flight 将 JS 逻辑置于另一层之后，其中单独的组件只能通过特定的事件调用（如 API？）来访问。

我不太确定我是否了解使用 JS 框架的好处以及 Flight 带来的好处。如果我制作一个移动应用程序来提高性能（服务器端的 JS？）并更好地控制哪些事件调用组件，我会使用它吗？

以下是到目前为止我能找到的一些文章/相关帖子：

• InfoQ
• 博客
• SO：为什么我们需要 JS 框架？

几个小时前，Twitter 发布了 Flight，一个基于组件的 JavaScript 框架。它的组件是普通的 DOM 元素，并通过普通的 DOM 事件进行通信，这非常好。

我只是想知道......我可以将它与 AngularJS 结合起来吗？如果我正确理解这两个框架，我可以使用 AngularJS 创建“新”元素，这些元素可以由 Flight 组件使用并包含它。这些组件可以通过 AngularJS 填充数据。换句话说：我可以像往常一样使用 AngularJS，但指令是“装饰”的 Flight 组件。（使用 Flight 来创建视图并使用 AngularJS 来处理其他所有事情。）

这有意义吗？如果不是......我不明白飞行的目的:(

要初始化google.maps为 AMD 模块，符合twitter/flight和requirejs，请使用：

我正试图绕过 Twitter 航班。假设我有一个程序页面，它有 16 个元素处理管理程序、CRUD 操作、AJAX 请求等...使用 twitter 飞行，我需要为每个节点元素或程序页面创建一个组件吗？将每个元素附加到程序组件中的函数？

我正在使用 Twitter Flight 构建一个与我们开发的 API 交互的 JavaScript 应用程序。我正在研究一种允许我们的用户登录和退出或注册帐户的架构。在高层次上，我的手动测试过程如下所示：

• 访问 localhost/login，验证登录表单呈现
• 点击“注册”
• 验证对 localhost/signup 的 url 更改，验证表单呈现
• 点击“登录”
• 重复

问题：当我从登录开始，导航到注册，然后返回登录时，登录组件不再监听它的渲染事件，并且永远不会渲染登录表单来代替注册表单。

我不完全确定真正诊断我的逻辑需要多少应用程序，但我认为我已经包含了所有相关部分。如果需要，我很乐意发布更多代码，但下面是我们的 Mediator 和 Signup.js。

谢谢！

.

我想确保在触发自定义 jQuery 事件时将对象的方法作为事件处理程序调用；但是单元测试似乎返回了一个假阴性，因为我的实现运行良好。

（这是使用Twitter Flight和Flight Jasmine 扩展的测试套件的一部分，但这只是一个普通的 Jasmine 间谍。）

这会导致规范失败：

Expected spy getPlan to have been called.

这是我的 Flight 组件的代码实现的片段（成功运行）：

在我的公司，我们正在评估几个模板引擎，以便选择一个与飞行一起使用。

这里的一些开发人员将子模板视为一项功能，而我认为它们不太适合 javascript 框架，因此不适合飞行，因为它们可能导致不良做法。

我认为子模板来自过去。如果使用框架，它的视图或组件应该是模块化单元。

在飞行方面，如果我有页面的模块化部分，最好将其作为不同的模板导入并在组件中呈现。然后我将至少为其附加点提供一个飞行选择器，并且将单独的模板文件演变成一个完整的飞行组件会容易得多。

我希望我的担忧是明确的。您对此有何看法？子模板是一种功能还是会导致团队中的不良做法？

编辑：我正在谈论的子模板的一个示例是部分，来自dustjs http://akdubya.github.io/dustjs/

在dustjs 文档的末尾，他们说dustjs 具有可组合的特性，但问题是模板可组合性还不够。javascript框架提供的模块化机制更强大，应该考虑在内。

我的目标是解耦的 UI 架构。我希望轮播和分页组件彼此分开；但分页能够监听“uiCarouselMoved”事件的变化。

示例： http: //jsbin.com/uQadehI/1/edit ?html,js,output

当我分别有两个轮播和分页实例时，就会出现问题。我想知道 Twitter Flight 中最好的设计模式来处理 Carousel 和 Pagination 组件之间的“桥梁”，而不依赖于不相关的逻辑，例如 DOM 树结构，最好没有硬编码的 ID。

那么，是否可以根据源轮播知道更新哪个分页？

我的页面上有以下输入元素：

我在这个元素上有一个 Twitter Flight 事件监听器，如下所示：

触发此方法：

最后触发 uiUpdateInputs：

所有这些功能都可以在 Chrome 和 Firefox 上正常运行。用户可以输入输入并“实时”查看页面变化。用户还可以获得额外的字段，他们可以在其中输入文本并查看页面更改。

使用 Safari 时会出现问题，当用户在所描述的输入字段中输入文本时，输入字段中的文本会突出显示（选中），当他们输入下一个字符时，所有内容都将替换为该单个字符。这导致用户在将它们全部替换为下一个输入的字符之前无法输入超过 1 或 2 个字符。

我尝试了几种方法来解决这个问题，但都没有奏效，它们包括：

• 使用 setTimeout 延迟在 keyup 事件上运行的代码
• 使用Selection尝试使用collapseToEnd禁用对文本的选择。
• 使用 click,focus,blur 事件尝试从输入的文本中删除选择
• 触发右箭头键事件以尝试简单地向前移动光标，这样用户就不会删除选定的文本
• 使用 setInterval 定期删除窗口所做的选择

我很困惑为什么会发生这种情况，我想知道这是否是 webkit with Flight 中的一个错误。我认为此页面的 Firefox 或 Chrome 版本没有问题。谢谢你的帮助！

我想用 CoffeeScript 类而不是函数来定义 flightjs 组件，但这似乎是不可能的，因为 flight 忽略了对象的原型。我不能写：

代替

因为第一个代码示例将 func1 和 func2 绑定到 MyDropdown 原型

所以我发现的唯一解决方法是在构造函数已经是飞行组件时创建“代理”类来绑定原型方法：

我认为我必须使用类作为参数调用父构造函数才能使其与飞行 API 一起使用，这很尴尬。我可以克服父类，只是在构造函数的开头编写代码，但我发现继承更灵活（如果我将来添加 DataComponent 和 Component 类）。

所以我想知道有没有更好的方法来将 CoffeeScript 的完整期货与 Twitter Flight 结合使用？

飞行不允许将方法绑定到对象原型似乎是违反直觉的......或者我错过了什么？

编辑

我现在发现的最佳解决方案：