button
Cập nhật lần cuối vào
Tini Button là một button component được xây dựng dựa trên Design System của Tiki.

Quét mã để trải nghiệm
Hoặc sử dụng link
https://tiki.vn/apps/vn.tiki.miniapp.demo?page=pages/component/advance/actions/button/index
Xem code mẫu trên Tini Studiohttps://tiki.vn/apps/vn.tiki.miniapp.demo?page=pages/component/advance/actions/button/index
Demo
Trải nghiệm thử với trình giả lập bên dưới
Thuộc tính
Thuộc tính | Kiểu dữ liệu | Giá trị mặc định | Mô tả |
---|---|---|---|
onTap | function(EventObject) | Hàm xử lý được gọi khi người dùng tap vào nút. | |
size | enum('large', 'medium', 'small') | large | Kích thước của button. |
type | enum('solid', 'outline', 'ghost') | solid | Kiểu định sẵn của button. |
shape | enum('pill', 'rounded', 'circle', 'square') | pill | Hình dạng định sẵn của button. |
disabled | bool | false | Nếu set về true , tắt tất cả interactions cho button. |
skeleton | bool | false | Nếu set về true , tắt tất cả interactions cho button và hiển thị default skeleton. |
loading | bool | false | Nếu set về true , tắt tất cả interactions cho button, hiển thị loading indicator. |
iconName | enum(icon:type) | Hiển thị một icon ở vị trí mặc định, icon sẽ bị ẩn nếu loading được đặt về true . Xem danh sách icon tại đây. | |
formType | formType | Xem thêm button:formType . | |
class | string | Class của button. | |
style | string | Inline styles cho button. |
Sample Code
Khai báo components:
Khai báo dưới đây sẽ thay thế
<button/>
mặc định của framework. Nếu không muốn điều này xảy ra, bạn có thể sử dụng tên khác tùy ý.
{
"defaultTitle": "Tini Button",
"usingComponents": {
"button": "@tiki.vn/tini-ui/es/tu-button/index"
}
}
<button onTap="onTap">Tini Button</button>
Page({
onTap(e) {
my.alert({ content: 'Button Clicked' });
}
});