Chuyển tới nội dung chính
ZZalo Platforms

BottomNavigation

Cập nhật lần cuối:
import { BottomNavigation } from "zmp-ui";

Dùng để hiển thị thanh điều hướng cố định ở phía dưới màn hình. Giúp người dùng dễ dàng điều hướng sang các trang khác.

Ví dụ​

Bảng thuộc tính​

PropertyTypeRequiredDescription
activeKeystringNoĐược sử dụng để chỉ định tab nào đang được chọn để hiển thị nội dung tương ứng _(active tab)_. Cần được sử dụng cùng với `onChange` để cập nhật lại giá trị.
onChange(activeKey: string) => voidNoĐược sử dụng để xử lý sự kiện khi tab được chọn thay đổi. Cần phải cập nhật lại giá trị của `activeKey` nếu được truyền vào.
defaultActiveKeystringNoĐược sử dụng để chỉ định tab nào sẽ được chọn mặc định khi component được hiển thị. _Lưu ý: Thay đổi `defaultActiveKey` khi component đã được render sẽ không có tác dụng._
childrenReactNodeNo
fixedbooleanNoGiữ `BottomNavigation` cố định ở phía dưới của ứng dụng và không scroll theo nội dung. (default: false)
zIndexnumberNoĐược sử dụng để xác định thứ tự hiển thị (`z-index`) của component BottomNavigation so với các thành phần khác có thể overlay trên ứng dụng.