RequireJS：如何在模块之间传递更新的数据

Question

第一次接触requirejs。我一直在通过移植我的一个旧项目来做到这一点。到目前为止，进展顺利。直到现在。

我一直在做的是保留一个包含系统设置的站点设置对象，例如 window 高度、window 宽度、文档高度、scrolltop 等。在那里我用调整大小更新了这些值和滚动事件。这些始终是我可以访问的全局变量。

例如（使用jQuery）

var mySettingsObject = {};
mySettingsObject.Init = function() {
  this.winWidth = $(window).width();

  $(window).resize(function(e) {
    mySettingsObject.winWidth = $(window).width();
  });
};

$(document).ready(function) {
  mySettingsObject.Init();
});

现在我可以随时从任何函数调用 mySettingsObject.winWidth 来访问该变量，并且它始终是最新的。

我想了解的是如何在 requirejs 中使用模块依赖性来实现相同的行为？

这是我的两个示例模块

define('system', function() {
  // Window settings 
  var winWidth = $(window).width();
  $(window).resize(function(e) {
    winWidth = $(window).width();
  }

  return {
    winWidth: winWidth
  };
  
});


// (is run on dom load)
define('myModule', ['system'], function(system) {
  $(window).on('resize', function() {
    if (system.winHeight === xyz) {
      // do something
    }
  });
});

system.winHeight 按预期工作，并给我 window 高度，因为它是 dom 负载。现在，如果我调整浏览器的大小，我怎样才能让该变量在 myModule 中自行更新，即我怎样才能让两个模块进行通信。

Answer 1

您可以将要导出的值分配给对象，此处称为 exports，并通过更新此对象上的相应字段来更新新值：

define('system', function() {
  // Window settings 
  var exports = {};
  exports.winWidth = $(window).width();
  $(window).resize(function(e) {
    exports.winWidth = $(window).width();
  }

  return exports;       
});

RequireJS：如何在模块之间传递更新的数据

RequireJS: How to pass updated data between modules

javascript

jquery

dependency-injection

requirejs