javascript - 如何使用 knockout.js 制作单页应用程序？

Question

您如何组织 View 模型类？单独的类还是一个巨大的类(以及如何模块化这个巨大的类)？如何在“页面”之间切换(当然是用ajax加载数据)？如何在页面加载后加载 backbonejs 的模板？只要示例和教程比他们网站上的示例和教程更高级，我们将不胜感激。

Answer 1

哇，很多问题都集中在一个问题上了。我会尝试在这里打他们，但免责声明我正在为 Pluralsight on Knockout 编写整个类(class)......所以我不能深入你需要一个评论框:)

1) 你如何组织模型- View 类？

我认为你的意思是 View 模型类。我建议创建一个包含页面所需的所有属性和方法的 View 模型。将 View 模型放在一个外壳中，并将所有 javascript 保存在它自己的文件中。例如，如果您的结构有页面 customers.html，那么您的 View 模型可以有 customers.js。

2) 单独的类还是一个巨大的类(以及如何模块化这个巨大的类)？

每个 View 模型都在自己的文件中。通常每个 js 文件 1 个 View 模型(但你当然可以将相互关联的模型放在同一个文件中)。此外，通常每个 View 1 个 View 模型(但同样，在某些情况下您可以超出此范围)。

对于模型，您可以根据需要将它们全部创建在一个模型文件中，或者将它们放在单独的文件中。对于较小的应用程序，我喜欢 1 个 models.js 文件，因为大多数模型非常简单、小并且包含简单的属性(尽管是可观察的)。但在这里，这确实是一个选择问题。

3) 如何切换页面？

该机制并非特定于 Knockout，因此您可以使用链接甚至自定义控件(菜单、选项卡等)。您的来电。一旦你决定如何导航到不同的页面，我假设你需要在 2 for context 之间传递数据一种方法是在带有 ID 的查询字符串中，另一种方法是本地存储(对于你需要存储的较大项目客户)，或者还有其他选择。同样，这实际上取决于您需要在页面之间传递的内容。很多时候我设计的页面是自给自足的，所以我不需要在它们之间传递太多。对于我需要传递的内容，我尝试尽可能少地发送并根据键查找数据(在 ajax 调用或本地存储中......无论数据位于何处)。

希望对您有所帮助。

更新:Here is the link I mentioned to my Knockout.js course on Pluralsight