如何在 Javascript/Backbone 中再次调用已加载的模块

Question

我是 Javascript/backboneJS/RequireJS 的新手。为了渲染我的前端，我制作了一个控制器、一个模型和一个视图。另外，我的 html 文件中有一个下拉菜单。

所以我到目前为止所做的是在我的 html 文件的最后

 require(['common'],function()
    {
      require(['jquery','fastclick','nprogress','charts','underscore','spinner'],function()
      {
        require(['firstDashboardController']);
      });
    });

所以我正在加载 "firstDashboardController" 并且此控制器相应地加载所有模块并在前端显示数据。所以一切正常。

现在我在前端有一个下拉菜单。当我 select 下拉菜单时，根据 id selected 我想检索数据。所以我需要再次调用 "firstDashboardController" 以便根据我获得的新 ID 呈现所有内容。

那我该怎么办？就像我需要 UN-REQUIRE 我的 "firstDashboardController" 然后再次要求它传递新的 id 一样。因为控制器已经通过 Require 加载，因为我如上所述将它加载到我的 HTML 文件中。但是我需要根据新的 id select 通过下拉列表重新加载它。那怎么办呢？请帮助我。如果需要任何代码片段，我可以输入。

代码片段：

我的控制器：

define(['backbone', 'firstSubViewModel','dropdownViewModel', 'dropdownModel'],
  function(Backbone, firstSubViewModel,  dropdownViewModel, dropdownModel) {

      var ch = new dashboardModel.chart({});
        if (localStorage.getItem('p_kt') && localStorage.getItem('p_acid') && localStorage.getItem('p_seid')) {
          var data = {
            tokenProp: localStorage.getItem('p_kt'),
            accountIdProp: localStorage.getItem('p_acid'),
            sessionIdProp: localStorage.getItem('p_seid')
          };
          $.when(
            ch.fetch(data) // GETTING DATA FROM MODEL VIA AJAX CALL in my model.JS

          ).then(function() {
            // Main Graph on Dashboard
            new firstSubViewModel({
              el: '#chartAnchor1',
              model: ch
            });
    });});

我不知何故需要再次致电 ch.fetch()。

Answer 1

您没有正确定义您的控制器。您目前将其作为一种一次性设置方法，而不是稍后可以重新运行的方法。一步一步来吧。

myLife.js:

define([], function() {
  return "a complex series of failures";
});

通过 returning 一个来自 define 回调的值，这定义了任何时候我需要 "myLife"，然后它将提供 "a complex series of failures"回调函数。这就是 Backbone 和其他 AMD 模块在您的代码块中出现的原因。但是，它只运行s 内容一次；并保存结果。所以，这行不通：

incrementer.js:

var x = 0;
define([], function() {
  x = x + 1;
  return x;
});

（尝试要求增量器总是给你“1”。）

你想要做的是return一个函数——一个你可以随时重新运行的函数。

incrementerV2.js:

define([], function() {
  var x = 0;
  return function() {
    x = x + 1;
    return x;
  };
});

在任何文件中，您都可以拥有：

require(['incrementerV2'], function(myIncr) {
  myIncr(); // 1
  myIncr(); // 2
});

...而且，作为记录，我建议尽可能在任何给定文件中只包含一个 require 语句。如果加载顺序很重要，您可以在第一个参数数组中添加依赖项。

更常见的是，人们会有一个模块包含一个自定义对象，其中有多个函数，而不是我上面给出的函数。返回然后只使用一个函数也是有效的，这取决于用例。任何变量类型都有效，但请记住，它永远是唯一的相同变量，您以后需要它时。

加载订单

当系统检索上面的 myLife.js 或 incrementer.js 时，在它实际上运行是我们定义的定义函数之前有一个中间步骤。它将查看第一个参数，命名依赖项的数组，并确定在它可以运行给定的函数之前是否仍然需要依赖项。示例：

a.js: require(['b', 'c'], function(b, c) {
b.js: define(['c'], function(c) {
c.js: define([], function() {

a.js 首先被请求，而不是运行，因为它需要 B 和 C。接下来加载 B，但被忽略，因为 C 没有被加载。 C 运行s，然后它的return值被传递给A和B。这个系统内部非常聪明，不应该两次请求同一个文件或者如果一个文件先于另一个文件加载而发生冲突。您可以像 Java.

中的导入一样使用它

此外，假设您只在 a.js 中添加了 'c'，这样 b.js 就不会崩溃，因为它需要先加载 - 在这种情况下，只需将其取出A 和它应该工作相同。

    a.js: require(['b'], function(b) {

就像 A 一样，B 会在执行任何操作之前自动加载其所有依赖项。一个简单的原则是仅在文件中实际直接引用依赖项（或定义必要的全局变量）时才引用依赖项

如何在 Javascript/Backbone 中再次调用已加载的模块

How to call a module again in Javascript/Backbone which is already loaded

html

javascript

requirejs

backbone.js

加载订单