Các loại Component

Bạn định nghĩa các Component. Các Component là lớp dữ liệu kết nối với giao diện người dùng.

Custom Components là Bài viết trên blog, Tác giả, địa chỉ, dữ liệu thô tùy chỉnh, v.v.

UI Components chỉ là các Custom Component được đánh dấu là UI Elements, footer, header, hero, v.v.

System Components được CMS xác định sẵn như Quốc gia và Ngôn ngữ.

UI Component là gì?

Trang được cấu thành từ nhiều hơn một UI Component

Ví dụ:

• hero-block
• feature-block
• image-carousel
• header/footer

Mỗi UI Component đại diện cho một phần của trang của bạn.

Quy trình làm việc của UI Component

1. Xác định một component (cấu trúc của khối) trong trình tạo component
2. Tạo UI component
3. Gán UI Component cho một trang
4. Kết xuất nó trên phía client với khối phù hợp trong block registry và cấu hình renderer

Ví dụ: Lược đồ Hero Block

Một hero block có thể chứa:

• Hình ảnh
• Tiêu đề
• Phụ đề

Lược đồ JSON trong trình chỉnh sửa

[
  {
    "name": "heading",
    "type": "string",
    "required": false,
    "displayName": "heading"
  },
  {
    "name": "subtitle",
    "type": "string",
    "required": false,
    "displayName": "subtitle"
  },
  {
    "name": "hero_img",
    "type": "image",
    "required": false,
    "displayName": "hero_img"
  }
]

Thiết lập Bảng điều khiển quản trị

• Tạo một khối mới
• Gắn lược đồ (HeroSchema)
• Đặt tên cho khối (ví dụ: hero-block)

Gán Khối cho Trang

• Đi tới một route trong bảng điều khiển quản trị
• Nhấp Assign Page
• Thêm khối vừa tạo

Kết xuất trên phía Client

Sau khi được gán, khối có thể được lấy và kết xuất ở phía client bằng cấu hình renderer của bạn.

Tóm tắt

• Các lược đồ xác định cấu trúc của các khối
• Các khối xác định các phần của một trang
• Các trang được cấu thành từ nhiều khối
• Hoàn toàn có thể tùy chỉnh và tái sử dụng