Dojo AMD: Kann keine Funktion innerhalb einer Anforderung anrufen

StackOverflow https://stackoverflow.com//questions/9626821

  •  09-12-2019
  •  | 
  •  

Frage

Ich bin wirklich ein Newbie to Dojo, aber da ich mit der Entwicklung einer neuen Anwendung mit Dojo Version 1.7.2 begonnen habe, wollte ich auch die neue AMD-Syntax für Funktionen verwenden. Leider scheine ich es nicht zu bekommen. :-(

Was mich am meisten ärgert, ist, dass ich nicht einfach keine Funktion nennen kann, die sich in einem "Anforderungen" -Block befindet. Zum Beispiel habe ich eine Seite, die beim Öffnen eine dynamische Tabelle mit mehreren Widgets in jeder Zeile erstellt. Dann habe ich einen Knopf, der jedes Mal eine leere Zeile fügt.

ohne AMD-Syntax wäre es einfach:
- Setzen Sie alle meine "dojo.require ()" in den Kopf
- und erstellen Sie dann einen Bündel meiner eigenen Funktionen zum Erstellen der Tabelle und Widgets
- Die Funktion Zeilen hinzufügen könnte problemlos auf alle globalen Variablen zugreifen Meine vorherige Funktion gefüllt

Aber mit AMD ist es so:

Die Anfangsfunktion erstellt die Tabelle und Widgets: generasacodicetagpre.

Jetzt nennt die Schaltfläche "leerer Zeile hinzufügen" seine eigene Funktion "adnPlendyrow" auf.
Aber in dieser Funktion muss ich:
- Fordern Sie ein anderes für jedes Dojo-Modul erneut ein, dass - Ich kann keine der Funktionen verwenden, die "innen" der "fillreportable" -Funktion sind. Zum Beispiel die "Createurwrow" -Funktion generasacodicetagpre.

Das alles scheint mit AMD so viel kompliziert zu sein.
Oder vermisse ich etwas offensichtliches hier?
Wenn Sie mit AMD Ihren Code in viele kleine Funktionen trennen, tun Sie die "Anforderung" in jeder Funktion in jeder Funktion erneut. Oder setzen Sie alle Funktionen in einem "Anforderungen" mit der vollständigen Liste ein?
Wenn Sie es den zweiten Weg tun, wie können Sie diese Funktionen von Widget-Ereignissen anrufen?

War es hilfreich?

Lösung

The easiest way would be to define your own module. Take a look at this tutorial first:

http://dojotoolkit.org/documentation/tutorials/1.7/modules/

Now define your own module, e.g. "./js/mymodules/mymodule.js" (relative to HTML page):

define([
    "dojo/dom-construct",
    "dojo/dom-attr",
    "dijit/form/FilteringSelect",
    "dojo/data/ItemFileReadStore",
    "dijit/form/ComboBox",
    "dijit/form/DateTextBox",
    "dijit/form/Select",
    "dojo/store/Memory"
], function (domConstruct, domAttr, FilteringSelect, ItemFileReadStore, ComboBox, DateTextBox, Select, Memory) {

    function fillReportTable(repId) {
       // a lot of code to create the table, consisting of SEVERAL functions 
       function createNewRow(tbl) { ...} 
       function function1 () {... } 
       function function2 () {... } 
       function function3 () {... } 
    }

    function addEmptyRow() {
       // a lot of code to create the table, consisting of SEVERAL functions
    }

    // Return an object that exposes two functions
    return {
        fillReportTable: fillReportTable,
        addEmptyRow: addEmptyRow
    }

});

And use your module like this:

<html>

<head>

<script>
var dojoConfig = {
    baseUrl: "./js/",
    packages: [
        { name: "dojo", location: "lib/dojo" },
        { name: "dijit", location: "lib/dijit" },
        { name: "dojox", location: "lib/dojox" }
    ]
};
</script>

<script data-dojo-config="async: true" src="js/lib/dojo/dojo.js"></script>

</head>

...

<script>
require([
    "mymodules/mymodule"
], function (mymodule) {
    mymodule.fillReportTable(...);
    mymodule.addEmptyRow(...);
});
</script>

Andere Tipps

Try this:

require([...], function() {
    var myFunctions = dojo.getObject('myFunctions', true);
    myFunctions.createNewRow = function(...) {
        ...
    };
});

You can now call your functions from anywhere by using 

myFunctions.createNewRow();

If you don't want 'myFunctions', you could do

require([...], function() {
    var createNewRow = function(...) {};

    dojo.setObject('createNewRow', createNewRow);
});

Paul Grime gave you a good example, so I'm just sharing some thoughts.

You don't define all the modules in each function, that's a huge waste of space. Although, even if you try to load a module multiple times, Dojo will only load it once anyway.

This is a simplified module from my latest project, with quite meaningless functionality:

//app module in 'my' folder

define(
[
    'app/elements',
    'dojo/query',
    'dojo/on',
    'dojo/fx',
    'dojo/_base/fx',
    'dojo/dom-construct',
    'dojo/_base/event'

    //and so on.....
], 

function(elements, q, on, fx, baseFx, constr, event)
{   
    return {

        init : function()
        {
            var node = q(elements.loading);
            this.removeNode(node);

            this.addEvents();
        },

        removeNode : function(node)
        {
            node.remove();
        },

        addEvents : function()
        {
            $(elements.buttons).on('click', function(e)
            {
                alert(q(e).attr('id') + ' was clicked!');
            });
        }   
    }
}

Then I get the module by using

define(
[
    'my/app',
], 

function (app) 
{
    app.init();
}
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top