Mobile 什么'；混合移动应用程序的最佳架构是什么？
我正在开发一个大型混合移动应用程序（PhoneGap/HTML5），它必须包含大量的视图和服务器调用。在互联网上搜索了一些之后，我发现我可以用RequireJS、主干网和jQuery Mobile来组织我的代码。我遵循了，这很有帮助，但我不是很满意 问题是，当我按下链接或按钮时，每个视图都由RequireJS加载，它会替换上一个视图的内容。。。我的意思是，Mobile 什么'；混合移动应用程序的最佳架构是什么？,mobile,backbone.js,cordova,requirejs,hybrid-mobile-app,Mobile,Backbone.js,Cordova,Requirejs,Hybrid Mobile App,我正在开发一个大型混合移动应用程序（PhoneGap/HTML5），它必须包含大量的视图和服务器调用。在互联网上搜索了一些之后，我发现我可以用RequireJS、主干网和jQuery Mobile来组织我的代码。我遵循了，这很有帮助，但我不是很满意 问题是，当我按下链接或按钮时，每个视图都由RequireJS加载，它会替换上一个视图的内容。。。我的意思是，之间的整个HTML代码被新视图的内容所取代。如果我决定不替换以前的代码并附加新代码，那么应用程序可能不是非常友好 我曾想过分离所有视图并将它们
<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<!-- ... -->
</head>
<body>
<!-- Here will be added the content of all the other HTML files -->
</body>
</html>
<!-- homeView.html -->
<div data-role="header" data-theme="f">
<h1 data-i18n="sections.home.title"></h1>
</div>
<div data-role="content">
<h1 data-i18n="sections.home.welcome"></h1>
</div>
<!-- otherView.html -->
<div data-role="header" data-theme="f">
<h1 data-i18n="sections.otherView.title"></h1>
</div>
<div data-role="content">
<p data-i18n="sections.otherView.content"></p>
</div>
感谢您的帮助。根据我的经验，主干为您提供了更细粒度的视图显示控制：您应该能够只替换视图的一部分，而无需在“替换所有内容”和“附加到当前HTML”之间进行选择 通常，将视图分成几个HTML文件是一个好主意（特别是考虑到您可以使用模板，例如下划线），但我认为如果这是您的意思，您不应该一次加载所有内容 如果你觉得它能回答你的问题，我会给你一个更详细的例子，但基本上，如果你按下一个链接或按钮，你就能捕捉到这个事件，并用它做任何你想做的事情，从替换整个视图到仅仅改变一个元素 编辑：我会在这里回答你剩下的问题。 首先，您应该了解一下，这是如何构造主干应用程序的一个非常好的演示。特别是，它们使用一个视图管理器（vm.js）来处理视图的创建 使用类似这样的方法可以在内存中保留视图的最后一个实例。例如，当您单击一个新闻项时，您的路由器将导航到/news/item/xx，您将使用视图管理器创建一个新闻项，并使用本地存储（如果您已经获取了内容）或轮询服务器来填充模型。 查看视图管理器代码，可以得到如下内容：
define([
'jquery',
'underscore',
'backbone',
'events'
], function($, _, Backbone, Events){
var views = {};
var create = function (context, name, View, options) {
if(typeof views[name] !== 'undefined') {
if (name === "homeview") {
views[name].reinit(); // <==== re-initialize your view
return views[name];
}
else {
views[name].undelegateEvents();
if(typeof views[name].clean === 'function') {
views[name].clean();
}
}
}
var view = new View(options);
views[name] = view;
if(typeof context.children === 'undefined'){
context.children = {};
context.children[name] = view;
} else {
context.children[name] = view;
}
Events.trigger('viewCreated');
return view;
};
return {
create: create
};
});
定义([
“jquery”，
“下划线”，
"骨干",，
“事件”
]，函数（$，\，主干，事件）{
var视图={}；
var create=函数（上下文、名称、视图、选项）{
如果（视图类型[名称]！=='未定义'）{
如果（名称=“homeview”）{
我们可以看到一个新闻应用程序。在家庭视图中，会有很多从服务器中检索到的消息，并且使用菜单面板，我可以打开设置视图。当我关闭这个视图时，我想回到与我离开的状态相同的状态（我想我有了卷轴向下……）。如何使用主干线（和下划线）并分隔这两个视图的HTML代码？所谓“状态”是指您希望保留从服务器获取的新闻项，例如，如果用户已向下滚动，则保留光标位置？是的，这就是我想要的：）查看更新后的回复：一种方法是使用视图管理器将视图的最后一个实例保留在内存中，并让该实例存储您想要的参数（例如，用户滚动的位置）当您切换到另一个视图时谢谢，我正在分析主干样板源代码，我认为这可能会有所帮助：）