button-bar

Tini Button-bar là một 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-bar/index

Xem code mẫu trên Tini Studio

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ả
onTapFirst	function(EventObject)		Hàm xử lý được gọi khi người dùng tap vào nút đầu tiên.
onTapSecond	function(EventObject)		Hàm xử lý được gọi khi người dùng tap vào nút thứ hai (nếu có).
onTapCheckbox	function(EventObject)		Hàm xử lý được gọi khi người dùng tap vào checkbox.
buttons	array		Mảng bao gồm các thuộc tính của các button hiển thị trên button-bar (tối đa 2 buttons)
direction	enum('row', 'column')	'row'	Hướng sắp xếp của các button
checkboxText	string	""	Nội dung hiển thị của checkbox
class	string		Class của button-bar.
style	string		Inline styles cho button-bar.

Sample Code

Khai báo components:

{
  "defaultTitle": "Tini Button-bar",
  "usingComponents": {
    "button": "@tiki.vn/tini-ui/es/button-bar/index"
  }
}

<button-bar checkboxText="Option"
            direction="row"
            onTapFirst="onTap"
            buttons="{{[
    {
        buttonText: 'Button1',
        shape: 'pill',
        type: 'outline',
    },
    {
        buttonText: 'Button2',
        shape: 'pill'
    },
]}}" />

Page({
  onTap(e) {
    my.alert({ content: 'First Button Clicked' });
  }
});