Wie funktioniert die initObservable-Funktion von Magento 2?


7

Wie funktioniert die initObservableFunktion von Magento 2 ?

Je detaillierter, desto besser, da ich der Meinung bin, dass nicht viele Leute die KO-Implementierung verstehen und dass die Kasse damit erstellt wird. Ich denke, wir sollten wirklich mehr darüber wissen. Die Entwicklerdokumente sind derzeit überhaupt nicht hilfreich, wenn es um KO geht, und da sie angepasst werden, hilft auch die KO-Website nicht weiter.

Alan Storm hat einige ausgezeichnete Artikel über M2 und KO geschrieben, aber selbst diese erklären nicht, wie es initObservablefunktioniert.

Der gesamte folgende Code befindet sich im Inneren

 vendor/magento/module-ui/view/base/web/js/lib/core/element/element.js

Ich beschäftige mich mit der Knockout-Implementierung von Magento 2 und kann diese Code-Schleifen durch jedes an sie übergebene Element sammeln und auslösen track.

    initObservable: function () {
        _.each(this.tracks, function (enabled, key) {
            if (enabled) {
                this.track(key);
            }
        }, this);

        return this;
    },

Die Spurfunktion ruft dann die Beobachtungsfunktion auf:

    track: function (properties) {
        this.observe(true, properties);

        return this;
    },

Die Beobachtungsfunktion funktioniert dann magisch. Hier verliere ich mich, da hier nichts als Referenz-Knockout erscheint.

    observe: function (useAccessors, properties) {
        var model = this,
            trackMethod;

        if (typeof useAccessors !== 'boolean') {
            properties   = useAccessors;
            useAccessors = false;
        }

        trackMethod = useAccessors ? accessor : observable;

        if (_.isString(properties)) {
            properties = properties.split(' ');
        }

        if (Array.isArray(properties)) {
            properties.forEach(function (key) {
                trackMethod(model, key, model[key]);
            });
        } else if (typeof properties === 'object') {
            _.each(properties, function (value, key) {
                trackMethod(model, key, value);
            });
        }

        return this;
    },

Antworten:


10

Die initObservableMethode richtet die Variablenverfolgung ein, wie in diesem Artikel beschrieben . Kurz gesagt: Auf diese Weise können Sie eine Eigenschaft zu einer beobachtbaren Knockout-Eigenschaft machen, indem Sie sie als tracksStandard auflisten . Durch beobachtbare Knockout-Eigenschaften kann die Benutzeroberfläche automatisch aktualisiert werden, wenn sie selbst aktualisiert werden.

Die initObservableMethode wird in der Methode von uiElement's aufgerufen initialize. Die initializeMethode ist eine __constructor/_constructStilmethode für das benutzerdefinierte Javascript-Objektsystem von Magento.

#File: vendor/magento/module-ui/view/base/web/js/lib/core/element/element.js
initialize: function () {
    this._super()
        .initObservable()
        .initModules()
        .initStatefull()
        .initLinks()
        .initUnique();

    return this;
},

Wenn Sie neugierig auf dieses Objektsystem sind, sind die Serien UI Components und uiElement Internals ein guter Ausgangspunkt.


Ist es initObversableoder initObverable? OP verwendet später einen in seiner Frage.
Rajeev K Tomy

2
Dies sind nicht die Tippfehler, die Sie suchen - es ist initObservable
Alan Storm
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.