Question

我的主要问题是当使用require.js时，我的功能不再是全局的。因此，当我从我的phtml文件中调用它时，它没有找到。知道在js文件中创建函数的正确方法是什么？我尝试过在网上找到的多种方法/答案，但似乎没有任何结果。有什么建议吗？

这是我的js文件

define([
  'jquery'
], function ($) {

  return function (config) { 
    console.log(config);
  }

  function initMap() {
    console.log('initMap is being called');
  }
});

我的requirejs-config.js文件：

var config = {
    map: {
        '*': {
            'gslMap': ['Gauge_StoreLocator/js/app']
        }
    }
};

我的phtml文件：回调函数＆＃34; initMap＆＃34;正在最后召集

<script async defer src="https://maps.googleapis.com/maps/api/js?key=<?php echo $this->getGoogleApi(); ?>&callback=initMap">

Answer 1

如果您必须使initMap函数全局化，可以通过故意将其泄漏到全局空间来实现：

define([
  'jquery'
], function ($) {

  return function (config) { 
    console.log(config);
  }

  function initMap() {
    console.log('initMap is being called');
  }

  // Deliberately leak initMap into the global space.
  window.initMap = initMap;
});

但请注意，在浏览器中使用时，RequireJS始终以异步方式运行。因此，如果您只是将script标记放在某处并希望获得最佳效果，那么您将遇到麻烦。如果它是由首先加载模块initMap的代码动态添加的，那么你就可以了。

请注意，map不接受数组。另一方面，paths确实接受数组作为值，但我没有看到只有一个元素的数组的点。（数组旨在提供回退。）由于您在map中提供的数组而导致的问题，由于JavaScript ["foo"].toString() === "foo"中的数组而且.toString()隐含调用，因此问题不会大声失败在处理map值的代码中，所以RequireJS看到你的数组的方式与你刚刚放入它包含的单个字符串而不是数组相同。如果您尝试使用多个元素的数组，那么您将遇到麻烦。

Magento 2：如何从phtml文件中调用我的Require.js文件中的js函数

1 个答案: