Προσαρμοσμένη Πλοήγηση

Ας πάρουμε τον ιστότοπο i18n-demo.github.io ως παράδειγμα για να εξηγήσουμε πώς να προσαρμόσετε την πλοήγηση.

Τα αρχεία που αντιστοιχούν στις αριθμημένες περιοχές στο παραπάνω σχήμα είναι τα εξής:

1. Αριστερά .i18n/htm/t1.pug
2. Δεξιά .i18n/htm/t2.pug

pug είναι μια γλώσσα προτύπου που δημιουργεί HTML .

➔ Κάντε κλικ εδώ για να μάθετε τη γραμματική του pug

Η συμβολοσειρά μορφής ${I18N.sponsor} χρησιμοποιείται στο αρχείο για την υλοποίηση της διεθνοποίησης και το περιεχόμενό της θα αντικατασταθεί με το αντίστοιχο κείμενο στον κατάλογο της γλώσσας πηγής i18n.yml

Το αρχείο .i18n/htm/topbar.css :

[!WARN] Μην γράφετε css και js στο pug , διαφορετικά θα υπάρξει σφάλμα.

Στοιχεία Ιστού

js δεν μπορεί να γραφτεί σε pug Εάν απαιτείται αλληλεπίδραση, μπορεί να επιτευχθεί δημιουργώντας ένα στοιχείο web.

Τα στοιχεία μπορούν να ορίσουν ένα στοιχείο ιστοσελίδας σε md/.i18n/htm/index.js και στη συνέχεια να χρησιμοποιήσουν το στοιχείο σε foot.pug .

Είναι εύκολο να δημιουργήσετε στοιχεία ιστού, όπως προσαρμοσμένες <x-img> .

customElements.define(
  'x-img',
  class extends HTMLElement {
    constructor() {
      super();
      var img = document.createElement('img');
      img.src = '//p.3ti.site/i18n.svg';
      img.style = "height:99px;width:99px;";
      this.append(img);
    }
  }
)

Επί του παρόντος, x/i-h.js αναφέρεται σε md/.i18n/htm/index.js , το οποίο είναι ένα στοιχείο ιστού που χρησιμοποιείται για τη διεθνοποίηση της πλοήγησης και του προσαρμοσμένου κειμένου του υποσέλιδου Δείτε τον πηγαίο κώδικα 18x/src/i-h.js