Giao diện

Câu hỏi thường gặp (FAQ) — Mobile ​

Sử dụng ​

Giao diện mobile khác gì desktop? ​

Đặc điểmDesktopMobile
Base path//m
UI LibraryAnt Design (antd)Ant Design Mobile (antd-mobile)
LayoutSidebar + HeaderTab Bar + Stack navigation
Cấu hìnhRiêng biệtRiêng biệt
Responsive> 1024px< 1024px

Giao diện mobile là hoàn toàn độc lập — cần cấu hình riêng các trang, không tự động kế thừa từ desktop.

Có ứng dụng mobile native không? ​

Hiện tại plugin cung cấp Progressive Web App (PWA). Bạn có thể thêm vào home screen điện thoại và sử dụng như ứng dụng native:

  • Mở toàn màn hình (không có thanh URL)
  • Icon trên home screen
  • Push notification (nếu được cấu hình)

Làm sao test giao diện mobile trên máy tính? ​

Hai cách:

  1. Chrome DevTools: Nhấn F12 → Toggle Device Toolbar → Chọn thiết bị (iPhone, Pixel, v.v.)
  2. Truy cập trực tiếp /m: Mở https://your-domain/m trên trình duyệt desktop — giao diện mobile sẽ hiển thị trong iframe preview

Trang mobile không hiển thị dữ liệu? ​

Kiểm tra theo thứ tự:

  1. Quyền ACL: User có quyền đọc Collection đó không? Vào Settings → Roles kiểm tra
  2. Route đã gán cho role: Route mobile phải được gán cho role của user (xem roles.mobileRoutes)
  3. Schema đã cấu hình: Route phải có schemaUid trỏ đến UI schema hợp lệ
  4. Data source: Đảm bảo Collection tồn tại và có dữ liệu

Cấu hình ​

Tab bar không hiển thị? ​

Kiểm tra:

  1. Đã cấu hình ít nhất 1 route với type: tab trong Settings → Mobile
  2. Route đó đã được gán cho role của user hiện tại
  3. Route không bị hidden = true

Tab con không hiển thị sau khi cấu hình? ​

Kiểm tra enableTabs của route cha:

  • Nếu enableTabs = false, tất cả route con sẽ bị hidden = true
  • Bật enableTabs cho route cha để hiện tab con

Tiêu đề tab không dịch được sang ngôn ngữ khác? ​

Plugin tự động đồng bộ tiêu đề route với plugin Localization. Kiểm tra:

  1. Plugin Localization đã được cài đặt và bật
  2. Vào Settings → Localization → Mobile Menu để thêm bản dịch
  3. Tên nguồn dịch: lm-mobile-routes

Lỗi thường gặp ​

Giao diện bị lỗi trên một số điện thoại? ​

Kiểm traCách xử lý
Trình duyệt cũCập nhật lên phiên bản mới nhất
Cache cũXoá cache trình duyệt hoặc hard refresh
Safe areaPlugin hỗ trợ safe area (notch, home indicator) — kiểm tra CSS
ViewportĐảm bảo meta viewport đúng: width=device-width, initial-scale=1

Không tự động chuyển sang giao diện mobile khi truy cập từ điện thoại? ​

Plugin sử dụng react-device-detect để phát hiện thiết bị. Nếu không tự chuyển:

  • Truy cập trực tiếp /m trên trình duyệt mobile
  • Kiểm tra User-Agent của trình duyệt có được nhận dạng đúng
  • Một số trình duyệt đặc biệt có thể cần cấu hình thêm

Route mới tạo nhưng user không thấy? ​

Plugin tự động gán route mới cho role có allowNewMobileMenu = true (mặc định: admin, member). Nếu user thuộc role khác:

  1. Vào Settings → Roles → [Role name] → Mobile Routes
  2. Gán route cho role đó
  3. Hoặc bật allowNewMobileMenu cho role