Προδιαγραφές δρόμου: κοινά, λίστες κώδικα, προσωρινή κατάσταση και διαδρομές plugins

jComponent 20 · jcomponent@20 jcomponentfrontendpathsstate Εκτελέστηκε με jComponent 20

Ένα μονοπάτι είναι όπου μια αξία ζει στην κατάσταση της σελίδας, και στο jComponent το πρώτο χαρακτήρα μπορεί να αλλάξει τη θέση.

Πρόθεμα	Παράδειγμα	Πού δείχνει
`*`	`*user.name`	η κοινή κατάσταση: `common.user.name` (το `*` μόνο του είναι `common`)
`#`	`#countries`	οι λίστες κωδικών: `DEF.cl.countries`, όπου το `CL()` αποθηκεύει τις λίστες που φορτώνει
`%`	`%step`	η προσωρινή κατάσταση: `DEF.tmp.step`, για τιμές που δεν ανήκουν στο μοντέλο
`?`	`?.items`	μέσα σε ένα `<ui-plugin>`: η διαδρομή εκείνου του plugin (δείτε τη συνταγή των plugins)
`plugin\`	path	`cart\`	items	μια ιδιότητα του αντικειμένου plugin με όνομα `cart`, από οπουδήποτε: `PLUGINS["cart"].items` (δεν είναι η διαδρομή κατάστασης `cart.items`)

Οι σημαίες μιας διαδρομής (@visible, @change...) είναι κάτι άλλο: έρχονται μετά από κενό (δείτε τη συνταγή των προσαρμοσμένων σημαιών). Οι διαδρομές χωρίς πρόθεμα είναι συνηθισμένες διαδρομές της κατάστασης (user.name).

public/index.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title>jComponent</title>
	<link rel="stylesheet" href="//cdn.componentator.com/spa.min@20.css" />
	<script src="//cdn.componentator.com/spa.min@20.js"></script>
</head>
<body>

	<ui-bind path="*user.name" config="text:value" class="common"></ui-bind>
	<ui-bind path="#greeting" config="text:value" class="cl"></ui-bind>
	<ui-bind path="%step" config="text:value" class="tmp"></ui-bind>
	<ui-bind path="plain.value" config="text:value" class="plain"></ui-bind>

	<ui-plugin path="cart">
		<ui-bind path="?.items" config="text:value" class="own"></ui-bind>
	</ui-plugin>

	<script>
		PLUGIN('cart', function(self) {});
		SET('*user.name', 'Peter');
		SET('#greeting', 'Hello');
		SET('%step', 3);
		SET('plain.value', 'plain');
		SET('cart.items', 7);
	</script>

</body>
</html>

Δοκιμάστε το στον browser σας

Επεξεργαστείτε το παράδειγμα και εκτελέστε το. Εκτελείται σε απομονωμένο πλαίσιο στον browser σας· τίποτα δεν στέλνεται στον διακομιστή μας.

Κώδικας

Προεπισκόπηση