jComponent 20 (frontend)
Συστατικά, plugins, σύνδεση δεδομένων και ό,τι εκτελείται στον περιηγητή.
Πρώτα βήματα με το jComponent 20
Φορτώστε το bundle του jComponent, ορίστε μια τιμή στην καθολική κατάσταση και εμφανίστε την με ένα στοιχείο ui-bind.
Ανάγνωση, αλλαγή και παρακολούθηση της κατάστασης
Χρησιμοποιήστε τα SET, GET, UPD, PUSH και WATCH για να δουλεύετε με την καθολική κατάσταση και να αντιδράτε όταν αλλάζει μια διαδρομή.
Γράψτε ένα δικό σας jComponent
Καταχωρίστε ένα επαναχρησιμοποιήσιμο συστατικό με COMPONENT(), αποδώστε το στο make(), αντιδράστε στις αλλαγές κατάστασης στο setter() και γράψτε πίσω με set().
Ρύθμιση ενός συστατικού και μεταγενέστερη επανάρυθμισή του
Δώστε σε ένα συστατικό προεπιλεγμένες επιλογές, παρακάμψτε τες στο χαρακτηριστικό config, αντιδράστε στο configure() και αλλάξτε τες κατά την εκτέλεση με reconfigure().
Κύκλος ζωής ενός συστατικού: make, setter και destroy
Μάθετε πότε το jComponent δημιουργεί, ενημερώνει και αφαιρεί ένα συστατικό και καθαρίστε χρονομετρητές και ακροατές στο destroy().
Επικύρωση εισόδου με το validate() ενός συστατικού
Υλοποιήστε το validate() σε ένα συστατικό, διαβάστε τις καταστάσεις invalid, touched και modified και βρείτε άκυρα πεδία με ERRORS().
Προδιαγραφές δρόμου: κοινά, λίστες κώδικα, προσωρινή κατάσταση και διαδρομές plugins
Ο πρώτος χαρακτήρας μιας διαδρομής jComponent επιλέγει όπου ζει η τιμή: * η κοινή κατάσταση, # οι λίστες κώδικα, % η προσωρινή κατάσταση, ? η κατάσταση του plugin και το plugin|Η διαδρομή είναι ιδιοκτησία ενός αντικειμένου plugins.
Φόρτωση μιας βιβλιοθήκης πριν ξεκινήσει ένα συστατικό
Απαριθμήστε scripts και στυλ ως εξαρτήσεις ενός συστατικού ώστε το jComponent να τα κατεβάζει μία φορά και να ξεκινά το συστατικό μετά.
Επέκταση συστατικών και plugins με EXTENSION
Προσθέστε συμπεριφορά σε ένα υπάρχον συστατικό απ' έξω, χωρίς να επεξεργαστείτε τον πηγαίο κώδικά του, με το EXTENSION().
Εμφάνιση, απόκρυψη και μορφοποίηση στοιχείων με ui-bind
Χρησιμοποιήστε εντολές ui-bind για να εναλλάσσετε ορατότητα, κλάσεις και HTML από την κατάσταση, χωρίς να γράφετε κώδικα DOM.
Απόδοση λιστών με πρότυπο ui-bind
Βάλτε ένα πρότυπο Tangular μέσα στο ui-bind με την εντολή template για να αποδίδετε πίνακες και αντικείμενα κάθε φορά που αλλάζουν τα δεδομένα.
Περισσότερες εντολές ui-bind: χαρακτηριστικά, τιμές, κατάσταση και μορφοποίηση
Ορίστε HTML, χαρακτηριστικά, τιμές φόρμας, απενεργοποιημένη κατάσταση και μορφή κειμένου από την κατάσταση με εντολές ui-bind.
ui-bind αναφορά: κάθε εντολή, επιλογή και χαρακτηριστικό
Όλες οι εντολές ui-bind με αυτό που κάνει ο καθένας, τις επιλογές που ελέγχουν όταν τρέχει, και τα χαρακτηριστικά που επιλέγουν το στοιχείο στόχου.
Συνιστώμενη αναφορά: ιδιότητες και μεθόδους του εαυτού
Η δήλωση ενός συνόλου jComponent 20 και τι προσφέρει η περίπτωση του: ιδιότητες, μεθόδους αξίας, βοηθούς DOM, γεγονότα, παρατηρητές και εντολές.
Ομαδοποίηση κατάστασης και λογικής σε ένα plugin jComponent
Δηλώστε ένα plugin με PLUGIN() και συνδέστε το σε ένα τμήμα της σελίδας με ui-plugin, χρησιμοποιώντας το ? ως τη δική του διαδρομή.
Δρομολόγηση σελίδων στον περιηγητή χωρίς επαναφόρτωση
Καταχωρίστε διαδρομές στην πλευρά του πελάτη με το ROUTE(), πλοηγηθείτε με το REDIRECT(), διαβάστε τις παραμέτρους του URL και το query string από το NAV και γυρίστε πίσω στο ιστορικό.
Φόρτωση τμημάτων μιας σελίδας με ui-import
Φέρτε ένα τμήμα HTML από τον διακομιστή σε ένα στοιχείο με ui-import ή IMPORT() και αφήστε το τμήμα να φέρει τα δικά του συστατικά.
Κλήση κώδικα με εντολές και EXEC
Καταχωρίστε εντολές με component.command() και καλέστε τες με CMD(), ή καλέστε μια μέθοδο plugin με EXEC('plugin/method').
Αποστολή events μεταξύ συστατικών με ON και EMIT
Αποσυζεύξτε τμήματα της σελίδας με καθολικά events: το EMIT() ανακοινώνει κάτι, το ON() ακούει, το OFF() σταματά να ακούει.
Αποθήκευση δεδομένων στον περιηγητή με CACHE, PREF και COOKIES
Κρατήστε τιμές ανάμεσα στις επισκέψεις με CACHE (με λήξη), PREF (προτιμήσεις χρήστη) και COOKIES.
Κοινές ρυθμίσεις με ENV και τη σύνταξη [key]
Καταχωρίστε τιμές με ENV() και χρησιμοποιήστε τες σε URL και στη ρύθμιση συστατικών με το σύμβολο θέσης [key].
Φόρτωση δεδομένων από μια διαδρομή Total.js με AJAX
Καλέστε μια διαδρομή Total.js από τη σελίδα με AJAX() και βάλτε την απάντηση στην κατάσταση του jComponent.
Κλήση διαδρομών API του Total.js με API()
Χρησιμοποιήστε το API(url, name, data, callback) για να καλέσετε τις ενέργειες ενός endpoint ROUTE('API ...'), μαζί με τα σφάλματα επικύρωσης.
Μεταφόρτωση αρχείων με UPLOAD() και πρόοδο
Στείλτε ένα FormData σε μια διαδρομή @upload του Total.js με UPLOAD() και παρακολουθήστε την πρόοδο.
Μικροί helpers: GUID, HASH, parseConfig, format και group
Χρησιμοποιήστε τις βοηθητικές συναρτήσεις που προσθέτει το jComponent: τυχαία id, hashes, strings ρύθμισης, μορφοποίηση κειμένου και ημερομηνιών και ομαδοποίηση.
Συντομεύσεις κατάστασης: INC, TOGGLE, NUL, UPDATE, UNWATCH, WAIT, BLOCKED και CACHEPATH
Μικρές συναρτήσεις που αλλάζουν ή παρακολουθούν μια τιμή της κατάστασης μέσω της διαδρομής της, περιμένουν μέχρι να υπάρξει μια τιμή, εκτελούν κάτι μόνο μία φορά ανά περίοδο και κρατούν μια τιμή της κατάστασης στην cache.
Βοηθοί δεδομένων: QUERIFY, STRINGIFY, ENCRYPT, FN, CL, TRANSLATE, UNAUTHORIZED και Thelpers
Δημιουργήστε συμβολοσειρές ερωτήματος, γράψτε JSON χωρίς ό,τι δεν θέλετε, κωδικοποιήστε μια τιμή με κλειδί, μεταγλωττίστε μια έκφραση, φορτώστε λίστες τιμών, μεταφράστε κείμενα, ελέγξτε δικαιώματα και προσθέστε βοηθούς στα πρότυπα.
Βοηθοί DOM: ATTRD, HIDDEN, VISIBLE, WIDTH, STYLE, NODEMOVE, DIFFDOM και APPEARANCE
Διαβάστε χαρακτηριστικά data, ρωτήστε αν ένα στοιχείο εμφανίζεται ή βρίσκεται στην οθόνη, προσθέστε στυλ που μπορείτε να αντικαταστήσετε, μετακινήστε στοιχεία μέσα στον γονέα τους, ενημερώστε μια λίστα χωρίς επανασχεδίαση και ορίστε τα χρώματα και τη σκοτεινή λειτουργία της σελίδας.
Εύρεση και κλήση στοιχείων και plugins: FIND, COMPONENTS, SETTER, EXE, TAPI, MIDDLEWARE και ADAPT
Βρείτε τα στοιχεία της σελίδας με όνομα ή διαδρομή, καλέστε μια μέθοδο πολλών στοιχείων ταυτόχρονα, καλέστε συναρτήσεις με όνομα, χρησιμοποιήστε δύο διευθύνσεις API με TAPI και PIPE, εκτελέστε middleware πριν από μια διαδρομή και αντικαταστήστε τους δείκτες ενός κειμένου.
Στείλτε προσαρμοσμένες σημαίες διαδρομής με το FLAGS
Εκτελέστε προσαρμοσμένες σημαίες, παρατηρήστε τα συμβάντα τους και διακρίνετέ τες από τις αλλαγές του μοντέλου και τις δεσμευμένες σημαίες κατάστασης.