RequireJS定义了返回错误模块依赖的回调

RequireJS define callback returning wrong module dependencies

本文关键字：依赖 回调 模块 错误 定义 返回 RequireJS      更新时间：2023-09-26

我在使用RequireJS时有一个非常奇怪和令人沮丧的问题。当我对带有依赖项列表的模块调用require时，回调中可用的所有依赖项都会引用单个模块。这可能更容易用代码来解释:

包含require.js脚本(不带data-main属性)

<script type="text/javascript" src="/js/common/require.min.js" ></script>

下面我包含require我的main.js(在网站的所有页面中使用)，在回调中需要我的页面特定的js。

<script type="text/javascript">
  require(['/js/require/main.js'], function () {
    require(['page/home_page']);
  });
</script>

main.js 

requirejs.config({
  baseUrl: 'js/require'
});
requirejs(['base'],
function() {
  var base = require('base');
  base.init();
});

home_page.js 

define(['home','searchbar'], function (home,searchbar){
  console.log(home.init == searchbar.init); // This is always true !!!
  home.init();
  searchbar.init();
});

home.js 

define(function(){
  this.init = function(){
    console.log('in home page'); 
  }
  return this;
});

searchbar.js 

define(function(){
  this.init = function(){
    console.log('Now in the searchbar init')
  }
  return this;
});

问题是在home_page.js两个模块home和searchbar引用相同的东西。奇怪的是，现在我已经简化了这个例子，它选择哪一个看起来很随机。大多数时候是搜索栏，但每刷新几次就会回到首页。

有人有什么想法吗?是非常明显的事情吗?

编辑:简化示例并提供所有模块源代码

您在两个模块中都分配给this。这不是一个好主意(请原谅双关语)。在这两种情况下this都可能是window对象。你可以通过添加

来检查
window.init === searchbar.init

测试。

重写模块以返回唯一对象，如下所示:

define(function() {
    return {
        init: function() {
            console.log('in home page'); 
        }
    };
});

和

define(function() {
    return {
        init: function() {
            console.log('Now in the searchbar init'); 
        }
    };
});
相关文章：