ractivejs - 如何在 active 组件之间共享行为

Question

也许这是一个基本的 javascript 问题，而不是特定于 Ractivejs 的问题。

我如何向 Ractive 组件添加共享行为...例如，如果多个组件都有一个 strip_whitspace() 方法，我如何避免在每个组件中重复它？

提前感谢您提供的任何 javascript 或 Ractivejs 见解。

Answer 1

通常的做法是使用extend，这很像传统 OOP 中的继承方式。在幕后，它使用原型(prototype)继承。

var CommonClass = Ractive.extend({
  // define common stuff
  strip_whitspace : function(){...}
});

var FirstClass = CommonClass.extend({
  // FirstClass stuff
});

var SecondClass = CommonClass.extend({
  // SecondClass stuff
});

如果您更喜欢动态构建对象而不是强加继承的更具组合性的方法，您始终可以使用来自其他库的扩展函数，例如 lodash 的 defaults。我更喜欢这种方法，因为我可以继承多个公共(public)对象。

var UtilsMixin = {
  strip_whitspace : function(){...}
};

var AnotherMixin = {...};

var FirstClass = Ractive.extend(_.defaults({
  // FirstClass stuff
}, UtilsMixin));

var SecondClass = Ractive.extend(_.defaults({
  // SecondClass stuff
}, UtilsMixin, AnotherMixin));