Отдельные функции Backbone View в отдельных файлах - PullRequest
Новая
       23

Отдельные функции Backbone View в отдельных файлах

0 голосов
/ 03 декабря 2018

У меня есть Backbone View.

Чтобы лучше организовать его код, я бы предпочел разделить некоторые его функции в отдельный файл.

Итак, я хотел быподдерживает структуру, но просто мне нужно разделить функции на разные файлы: 

- MyView
   - functions A -> file A;
   - functions B -> file B;

Я хотел бы использовать представление в том же текущем режиме.Поэтому мне нужно вызвать функции «А» на мой взгляд: myViewInstance.functionA_1()

Какой правильный способ / шаблон для реализации этого?

Я также использую RequireJS.

1 Ответ

0 голосов
/ 26 декабря 2018

Вы можете использовать Mixin pattern .Разделите прототип MyView на основную и другие части, поместите их в отдельные модули, сделайте так, чтобы основной модуль зависел от них, и объедините части.

Добавьте элементы прототипа из основной части вобъявление MyView как обычно: 

var MyView = Backbone.View.extend({
  method: function () {
    this.otherMethod();
  }
});

Поместите остальные части прототипа в отдельные модули и экспортируйте их как литералы объекта: 

var prototypePart = {
  otherMethod: function () {}
};

Заставьте главный модуль зависеть от нихи объединить прототип из всех импортированных деталей, либо Object.assign , либо _. extend : 

// Merging the prototype with ES6.
Object.assign(MyView.prototype, prototypePart);
// Merging the prototype with Underscore.js.
_.extend(MyView.prototype, prototypePart);

Вы получите MyView, как если бы оно было объявлено "в одной части ": 

var MyView = Backbone.View.extend({
  method: function () {
    this.otherMethod();
  },
  otherMethod: function () {}
});

Например, myview.js export MyView.Это зависит от двух других модулей для импорта из них других частей прототипа MyView: 

define([
  'underscore', 'backbone', './myview-a', './myview-b'
], function (_, Backbone, myViewA, myViewB) {
  var MyView = Backbone.View.extend({
    // ...prototype members from this module
    initialize: function () {
      this.fromModuleA();
    }
  });
  // Add prototype members imported from other modules
  _.extend(MyView.prototype, myViewA);
  _.extend(MyView.prototype, myViewB);
  return MyView;
});

myview-a.js экспортирует объект с группой дополнительных MyView членов прототипа: 

define(function () {
  var myViewA = {
    // ...prototype members from this module
    fromModuleA: function () {
      this.fromModuleB();
    }
  };
  return myViewA;
});

myview-b.js экспортирует объект с другой группой MyView членов-прототипов: 

define(function () {
  var myViewB = {
    // ...prototype members from this module
    fromModuleB: function () {}
  };
  return myViewB;
});
...