将撇号与实现一起使用时出现类型错误

Question

我创建了一个示例 repo 来展示我在将具体化加载到撇号资产管道时遇到的一些错误。这是撇号样板作为最小示例，在 public 资产文件夹中包含 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);
  };
};

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

Answer 1

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

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

将撇号与实现一起使用时出现类型错误

TypeError when using apostrophe with materialize

jquery

materialize

apostrophe-cms