Question

我创建了一个示例repo，以显示将物化加载到撇号资产管道中时遇到的一些错误。这是一个撇号样板，作为公共资产文件夹中materialize.css和.js的最小示例。

在管理界面“用户”或“全局”中打开图像，文件或页面的模式时，出现以下错误：

TypeError: this.dropdownEl is null materialize.js:2571:9
    _makeDropdownFocusable http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:2571
    Dropdown http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:2299
    init http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:1045
    init http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:2825
    _setupDropdown http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:6561
    Autocomplete http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:6478
    init http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:1049
    init http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:6878
    pluginName http://localhost:3000/modules/my-apostrophe-assets/js/materialize.js:1153
    selective jQuery
    enableTags http://localhost:3000/modules/apostrophe-schemas/js/user.js:515
    populate http://localhost:3000/modules/apostrophe-schemas/js/user.js:1160
    populate http://localhost:3000/modules/apostrophe-schemas/js/user.js:42
    _withoutIndex http://localhost:3000/modules/apostrophe-assets/js/vendor/async.js:181
    iterate http://localhost:3000/modules/apostrophe-assets/js/vendor/async.js:262
    iterate http://localhost:3000/modules/apostrophe-assets/js/vendor/async.js:274
    only_once http://localhost:3000/modules/apostrophe-assets/js/vendor/async.js:44
    partiallyApplied http://localhost:3000/modules/apostrophe-assets/js/vendor/setImmediate.js:27
    runIfPresent http://localhost:3000/modules/apostrophe-assets/js/vendor/setImmediate.js:46
    onGlobalMessage http://localhost:3000/modules/apostrophe-assets/js/vendor/setImmediate.js:92

我认为这是由materialize.js中的以下功能引起的：

/**
 * Initialize jQuery wrapper for plugin
 * @param {Class} plugin  javascript class
 * @param {string} pluginName  jQuery plugin name
 * @param {string} classRef  Class reference name
 */
M.initializeJqueryWrapper = function (plugin, pluginName, classRef) {
  jQuery.fn[pluginName] = function (methodOrOptions) {
    // Call plugin method if valid method name is passed in
    if (plugin.prototype[methodOrOptions]) {
      var params = Array.prototype.slice.call(arguments, 1);

      // Getter methods
      if (methodOrOptions.slice(0, 3) === 'get') {
        var instance = this.first()[0][classRef];
        return instance[methodOrOptions].apply(instance, params);
      }

      // Void methods
      return this.each(function () {
        var instance = this[classRef];
        instance[methodOrOptions].apply(instance, params);
      });

      // Initialize plugin if options or no argument is passed in
    } else if (typeof methodOrOptions === 'object' || !methodOrOptions) {
      plugin.init(this, arguments[0]);
      return this;
    }

    // Return error if an unrecognized  method name is passed in
    jQuery.error("Method " + methodOrOptions + " does not exist on jQuery." + pluginName);
  };
};

我真的很高兴有人可以看看这个错误是如何解决的。 THX

Answer 1

我发现最简单的解决方案是在lib/modules/apostrophe-assets/index.js中添加实现作为撇号资产管道的组成部分。如果您不使用所有组件，这甚至可以节省很多不必要的文件。

   ...
    {
      name: 'vendor/materialize/cash'
    },
    {
      name: 'vendor/materialize/component'
    },
    {
      name: 'vendor/materialize/global'
    },
   ...

在实现中使用撇号时出现TypeError

1 个答案: