Მორგებული Ნავიგაცია

ავიღოთ დემო საიტი 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 ში. თუ საჭიროა ურთიერთქმედება, მისი მიღწევა შესაძლებელია ვებ კომპონენტის შექმნით.

კომპონენტებს შეუძლიათ განსაზღვრონ ვებ გვერდის კომპონენტი 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