使用带有主干.js视图的 jquery 自定义小部件

Question

我有一个自定义的jQuery小部件，它正在从我的应用程序中调用，该小部件使用主干.js用于MVC。如何在自定义 jQuery 小部件中使用主干事件模式？

function( $ ) {
  $.widget( "medex.chooser", {
  ...
  _create: function() {
      // Would I create a new backbone view here???
  }
}

谢谢。

Answer 1

我认为您需要定义一个自定义视图，然后由自定义小部件调用。

例如，在应用初始化代码中：

APP = {};          // your app's global object
APP.Views = {};
APP.Views.WidgetView = Backbone.View.extend(
{
    events: {
        "click .grid1" : "onGrid1Click"
    },
    initialize: function() {
        // code here
    },
    onGrid1Click : function(evt) {
        // code here
    }
});

那么这将是你的小部件的构造函数代码：

function Widget(element) {
   this.view = new APP.Views.WidgetView({ el: element });
}

此代码可能不完全有效，但应该可以让您了解要查找的结构。 莱姆知道这是否适合你。

Answer 2

如果您仍在寻找答案，则可以将小部件转换为视图。从小部件转换为视图的基本规则如下：

• _create变为初始化
• this.element 變成 this.$el
• 刷新变为渲染
• 销毁变为删除
• $（'.someDiv'）.myWidget（） 成为新的 MyView（{ el： $（'.someDiv'） }）;
• 选项必须成为构造函数参数，但可以通过几种不同的方式进行处理