Question

我的Chrome扩展程序有两个主要组件脚本：

popup.js和popup.html - 分别是扩展逻辑和用户界面。
scrape.js - 嵌入到网页中的JavaScript以获取关键值。

scrape.js - 非常简单。它只做两件事：

抓取网页的密钥。
使用抓取密钥运行6个不同的数据库查询。由于涉及的库（我无法控制），数据库查询必须从scrape.js运行（即在选项卡的网页上下文中）。

当（或更重要的是，如果）6个查询中的每个查询完成时，scrape.js会调用popup.js通知它，某些数据已准备好呈现。

收到回叫通知popup.js后，使用Backbone模型和视图呈现scrape.js提供的数据：

var modelA = Backbone.Model.extend({...});
modelA.set({...});

var modelB = Backbone.Model.extend({...});
modelB.set({...});

这些模型是根据回调创建的，只有在scrape.js到popup.js进行相关回调时才存在。从这个意义上讲，模型和呈现它们的任何视图都是可选。

如果进行回调，模型将存储在全局变量modeInstances中，以便稍后再渲染。如果完成所有6个查询，则会进行6次回调，并且将modeInstances中存储6个Backbone模型实例。

当popup.js收到最终回调时，它会呈现所有模型和视图：

modelInstances.a = modelA; // Could be undefined.
modelInstances.b = modelB; // Could be undefined.

我有三个Backbone.js视图，其中一个视图呈现两个模型（A和B）：

var viewA = new Views.ViewA({
  modelA: modelInstances.modelA,
});
viewA.render();

var viewB = new Views.ViewB({
  modelB: modelInstances.modelB,
});
viewB.render();

var viewAandB = new Views.ViewAandB({
  modelA: modelInstances.modelA,
  modelB: modelInstances.modelB,
});
viewAandB.render();

如果未创建modelA或modelB，我会在View的初始化方法中收到异常（读取下面的代码注释）：

Views.ViewAandB = Backbone.View.extend({
  initialize: function(options) {
    var self = this;

    // Even if models are undefined, this is OK.
    this.modelA = options.modelA;
    this.modelB = options.modelB;

    _.bindAll(this, 'render');

    // This fails if models are undefined.
    this.bidderModel.bind('change', this.render);
    this.buyerModel.bind('change', this.render);
  },
});

我可以围绕创建具有条件的视图的代码，但这感觉很麻烦：

if (modelInstances.modelA && modelInstances.modelB) {
    var viewAandB = new Views.ViewAandB({
      modelA: modelInstances.modelA,
      modelB: modelInstances.modelB,
    });
    viewAandB.render();
}

我可以检查视图的初始化和渲染方法，但这也太麻烦了，因为它必须在使用视图模型的任何方法中重复：

initialize: function(options) {
  var self = this;
  var haveModels = (options.modelA && options.modelB);

  if(!haveModels) {
    // No data.
    return;
  }

  // Even if models are undefined, this is OK.
  this.modelA = options.modelA;
  this.modelB = options.modelB;

  _.bindAll(this, 'render');

  // This fails if models are undefined.
  this.bidderModel.bind('change', this.render);
  this.buyerModel.bind('change', this.render);
},

问题：在渲染“可选”视图时，如何检查是否创建了必要的模型？

在渲染视图之前验证存在Backbone.js模型

0 个答案: