不带 AMD 的 Select2 自定义 dataAdapter答案

【问题标题】：Select2 custom dataAdapter without AMD不带 AMD 的 Select2 自定义 dataAdapter
【发布时间】：2015-12-29 07:54:44
【问题描述】：

我想为 select2 创建一个自定义 dataAdapter，但我在网上看到的示例都使用 AMD。我们的项目中不使用 AMD。如何创建我的自定义 dataAdapter？实现current 和query 方法的普通对象是不够的。

【问题讨论】：

标签： javascript jquery-select2 jquery-select2-4

【解决方案1】：

事实证明，您几乎可以完全避免使用 AMD。以下适用于 select2 版本 4.0.10：

const ArrayAdapter = $.fn.select2.amd.require("select2/data/array");

class DataAdapter extends ArrayAdapter
{
    constructor($element, options)
    {
        super($element, options);
    }

    query(params, callback)
    {
        console.log("params: " + JSON.stringify(params));
    }
}

$("#my-combo-box").select2(
    {
        dataAdapter: DataAdapter
    }
);

您可以访问$.fn.select2.amd.require._defined["select2/data/array"] 而不是调用amd.require()，但可能没有意义：)

【讨论】：

我多年来一直在寻找这个答案。谢谢！比我见过的任何东西都干净。
@NickBrunt 嘿伙计，你能分享一个简单的例子来说明你是如何做到这一点的吗？我正在尝试使用 Dropdown 装饰器自定义下拉内容，但遇到困难:(。提前致谢。

【解决方案2】：

Select2 有一个内置的 AMD 加载程序，用于加载插件和适配器，因此您需要使用它来构建您的自定义数据适配器。

您可以在Add decorator to data adapter in Select2 version 4.x找到自定义数据适配器的示例

您需要使用 jQuery.fn.select2.amd 中 Select2 提供的方法，而不是直接调用 define。所以像

define('something/awesome', ['select2/data/array', function (ArrayAdapter) {
  // Use the array adapter
}]);

会变成

jQuery.fn.select2.amd.define('something/awesome', ['select2/data/array', function (ArrayAdapter) {
  // Use the array adapter
}]);

【讨论】：