0

前言：我是骨干菜鸟。您在下面看到的大部分内容可能是可怕的代码。

所以这就是我所拥有的： 我正在构建一个移动锻炼应用跟踪器。我正在使用Junior框架来处理一些视图切换——这可能是我的问题，但值得怀疑。

这个应用程序有 2 个模型：app.Workout和app.Exercise. 两者都没有绑定到任何数据库后端，此时我只是使用 localStorage。这些模型也有 2 个集合，ala：

var app = app || {};

(function() {
  'use strict';

  /* collection */
  app.ExercisesCollection = Backbone.Collection.extend({
    model: app.Exercise,
    localStorage: new Backbone.LocalStorage("Exercises")
  });

  /* create the collection */
  app.Exercises = new app.ExercisesCollection();

})();

太好了，所以现在我们有了收藏。

如您所知，有锻炼。这些锻炼中有相关的练习。我选择将 2 个模型和集合分开，因为我认为否则它可能会变得太复杂。也许我错了？

我的视图结构也相当基本。流程将类似于：

Home -> 
  Workouts -> 
    (you can add workouts here, or delete)
    Exercises -> 
     (you can add exercises here, or delete)
     Add Exercise

我正在努力解决的问题是如何在这些视图之间传递数据。例如，我添加了一个锻炼（效果很好，我只是添加到集合中）。现在我已经选择了那个锻炼，并想向它添加练习。太好了，我加载了AddExerciseView，但是该视图如何知道我要将锻炼添加到哪个锻炼？

我已经尝试在选项中“传递”一些东西，但这似乎不起作用。

onClickButtonAdd: function() {
  Jr.Navigator.navigate('add-exercise', {
    workoutName: this.workoutName,
    trigger: true,
    animation: {
      type: Jr.Navigator.animations.SLIDE_STACK,
      direction: Jr.Navigator.directions.UP
    }
  });
}

我正在尝试传递锻炼名称，但这不起作用。

我是否在考虑这个问题，或者是否有更好的方法来管理视图/模型（我听说过 Marrionette）。

谢谢！

4

1 回答 1

2

有两种常见的方法可以干净地连接视图。

将模型作为选项传递给视图

在这种情况下，您将执行类似的操作new AddExerciseView({workout: selectedWorkoutModel})，该视图将从用户那里收集数据，创建一个新Exercise模型实例，并将其添加到它在其初始化选项中获得的锻炼模型中。

视图发出事件，路由器/控制器从那里获取

在这个版本中，您AddExerciseView只需收集数据，创建一个新exercise模型实例，然后发出一个类似create-exercise. 然后视图的工作就完成了，它不知道也不关心从那时起练习模型实例会发生什么。在可能存在于路由器或专用控制器对象中的“胶水”代码中，将事件侦听器绑定到AddExerciseView实例，当create-exercise事件触发时，将新的运动模型实例添加到适当的锻炼实例。

一般来说，第一个选项很好，特别是对于较小的应用程序，而第二个版本只是开始变得更可取，因为您的应用程序变得有点大，并且视图开始在几个不同的上下文中被重用。

于 2013-05-27T07:47:25.897 回答