如何覆盖基视图中的render()方法，并向模板中添加更多选项？

Question

抱歉，就主干和车把而言，我是个菜鸟，你会发现我的问题是用我更熟悉的语言来表达的，比如Java。

我在找一些我确信一定是常用模式的东西。

我有一个单页面应用程序，其中三个视图(让我们称它们为RealView1，RealView2和RealView3)从相同的基视图扩展。这三个视图都没有显式的render()方法；相反，基本视图有自己的render()方法，如下所示：

    render: function () {
        console.log("I am BaseView");
        this.$el.html(this.template({readOnly: this.readOnly}));
        ...
        return this;
    }

从上面可以看出，BaseView有一个'readOnly‘布尔值，在构造BaseView时通过选项传入，即通过BaseView的initialize: function (选项)传入。然后，可以在任何相关的Handlebar模板中引用readOnly。

我现在想要做的是扩展RealView3的功能(但只是那个视图)，让一个名为“canEditRule”的新选项传入其中；这需要使其可用于RealView3的Handlebars模板，就像它的BaseView“parent”中的“readOnly”一样。

我的问题是:我假设我需要以某种方式为RealView3提供自己的render()方法，该方法：

(a)实现/覆盖来自BaseView的render()，并且，

(b)除了BaseView中已存在的readOnly选项外，还使canEditRule选项可用于RealView3 Handlebar模板

读过Backbone和Handlebar文档后，我并不明智--也许我没有在正确的地方寻找正确的东西！有没有人能给我提供一个代码片段来做我正在寻找的事情呢？

Answer 1

您可以简单地扩展BaseView并覆盖render方法：

const RealView3 = BaseView.extend({
  // ...
  render() {
      this.$el.html(
          this.template({
              readOnly: this.readOnly,
              canEditRule: this.canEditRule,
          })
      );
  }
});