Question

这是我第一次看到requirejs。我通过移植我的旧项目来做到这一点。它到目前为止一直顺利进行。到现在为止。

我一直在做的是保持包含系统设置的网站设置对象，例如窗口高度，窗口宽度，文档高度，滚动顶部等。在那里，我使用调整大小和滚动事件更新了这些值。这些都是我可以访问的全局变量。

例如（使用jQuery）

＆＃13;

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

＆＃13;

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

我想要了解的是如何在requirejs中使用模块依赖关系来获得相同的行为？

这是我的两个示例模块

＆＃13;

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
    }
  });
});

＆＃13;

system.winHeight按预期工作，并给出窗口高度，因为它是在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：如何在模块之间传递更新的数据

1 个答案: