window.EasySvgPanel.api

JavaScript · Easy SVG · Status: Stabil

window.EasySvgPanel.api sagt deinem Script, welche Fassung des Panel-Vertrags das installierte Easy SVG spricht. Es ist eine schlichte Zahl, dieselbe wie die PHP-Konstante EASY_SVG_PANEL_API. Prüf sie, bevor du eine Funktion nutzt, die erst eine neuere Stufe gebracht hat, dann läuft dein Add-on auch auf Sites weiter, die noch nicht aktualisiert haben.

Verwendung

const level = Number( window.EasySvgPanel.api || 1 );

Wann du es brauchst

• Bevor du registerCollections() aufrufst, das es ab Stufe 3 gibt.
• Bevor du dich bei einem Tab auf area oder ein eigenes icon verlässt, die mit Stufe 2 kamen.
• In einem Add-on, das mehrere Easy-SVG-Versionen unterstützt und sich zurücknehmen soll, statt kaputtzugehen.

Wann nicht:

• Um Plugin-Versionen zu vergleichen. Die Stufe ändert sich nur, wenn sich die Form des Panel-Vertrags ändert; viele Releases teilen sich eine Stufe.
• In PHP. Dort liest du EASY_SVG_PANEL_API direkt, etwa bevor du die Action easy_svg_panel_enqueue einhängst.

Parameter

Keine. Es ist eine reine Lese-Zahl am Registry-Objekt.

Rückgabewert

Standardwert

1, wenn die lokalisierten Daten des Panels kein panelApi enthalten. Auf Panels, die älter als diese Eigenschaft sind, ist window.EasySvgPanel.api gleich undefined, deshalb fallen die Beispiele auf 1 zurück.

Beispiele

Die Stufe lesen

const panel = window.EasySvgPanel;
const level = panel ? Number( panel.api || 1 ) : 0;

if ( 0 === level ) {
	// Nicht auf der Icons-Seite, oder das Panel wurde nicht geladen.
}

Eine Funktion der Stufe 3 nur nutzen, wo es sie gibt

( function () {
	const panel = window.EasySvgPanel;
	if ( ! panel ) {
		return;
	}

	if ( 3 <= Number( panel.api || 1 ) ) {
		panel.registerCollections( {
			id: 'myaddon',
			load: () => [],
		} );
	}
} )();

Die Methode prüfen, nicht nur die Zahl

Für zusätzliche Sicherheit kombinierst du die Stufe mit einer Typprüfung. Sollte eine künftige Stufe eine Methode einmal ändern, verhindert die Typprüfung trotzdem, dass dein Script einen Fehler wirft.

const panel = window.EasySvgPanel;
const canCollect =
	!! panel &&
	3 <= Number( panel.api || 1 ) &&
	'function' === typeof panel.registerCollections;

In PHP entscheiden, ob das Script überhaupt lädt

Dieselbe Zahl gibt es auf dem Server, du kannst das Einreihen auf zu alten Panels also ganz weglassen.

add_action( 'plugins_loaded', 'myaddon_boot' );

function myaddon_boot() {
	if ( defined( 'EASY_SVG_PANEL_API' ) && 3 <= (int) EASY_SVG_PANEL_API ) {
		add_action( 'easy_svg_panel_enqueue', 'myaddon_enqueue_panel' );
	}
}

So funktioniert es

1. In PHP gibt easy_svg_panel_assets() 'panelApi' => (int) EASY_SVG_PANEL_API als Teil von window.EasySvgPanelData an wp_localize_script(). Genutzt wird die Konstante selbst, PHP und JavaScript können also nicht auseinanderlaufen.
2. wp_localize_script() macht aus skalaren Werten Strings, EasySvgPanelData.panelApi kommt also als "3" an.
3. Wenn das Panel-Bundle die Registry anlegt, rechnet es einmal Number( EasySvgPanelData.panelApi || 1 ) aus und speichert das Ergebnis als api.

Der Wert wird einmal beim Anlegen gelesen. Solange die Seite offen ist, ändert er sich nicht.

Stolperfallen

• Nimm api statt EasySvgPanelData.panelApi. Der lokalisierte Wert ist ein String, '3' >= 3 klappt also über Typumwandlung, '3' === 3 aber nicht. api ist schon eine Zahl.
• undefined auf sehr alten Panels. Fall immer zurück, etwa mit Number( panel.api || 1 ).
• Schreib nicht hinein. Eine geänderte Zahl bringt keine neuen Funktionen, sie lässt nur deine eigenen Prüfungen lügen.
• Die Stufe ist nicht die Plugin-Version. Easy SVG 5.4.0 hat Stufe 3; leite das eine nicht aus dem anderen ab.

Siehe auch

• EASY_SVG_PANEL_API
• window.EasySvgPanel
• window.EasySvgPanel.registerTab()
• window.EasySvgPanel.registerCollections()
• window.EasySvgPanelData
• easy_svg_panel_enqueue