Hiển thị một widget

Tbox Mini App cho phép Nhà Phát Triển có thể render một Widget từ một Mini App bất kỳ.

Xét trường hợp ứng dụng DSHome như sau

Trong ứng dụng DSHome, có rất nhiều phần để hiển thị các Widget khác nhau từ các ứng dụng Digital Service. Một trong các Widget này là Widget từ ứng dụng Mua Vé Máy Bay.

Để thực hiện chức năng này, Tbox Mini App cung cấp API renderWidget.

Hàm renderWidget nhận vào các tham số

tên trường	kiểu dữ liệu	bắt buộc phải có	ý nghĩa
appId	string	có	id của ứng dụng cung cấp widget
name	string	có	tên của widget, cấu hình theo file manifest.json
params	object	không	danh sách các parameters được truyền cho Widget này, giá trị mặc định là {}

Hàm renderWidget trả về một React Component được định nghĩa trong code base của Ứng Dụng Mini App cung cấp Widget.

Hiện tại, chúng ta cho phép một Mini App mở một Widget bất kỳ Tuy nhiên, trong tương lại, chúng ta sẽ có cơ chể để đảm bảo Mini App nào được render Widget từ ứng dụng nào

Ví dụ

Với ứng dụng DSHome như ở trên, chúng ta có thể viết đoạn code để cài đặt như sau

import React from "react";
import tbox from "tbox";

function ListIcon() {
  const widget = [
    {
      appId: 1,
      name: "buy",
      params: {},
    },
  ];

  return (
    <Container>
      {widgets.map((wg) => {
        return tbox.renderWidget(wg.appId, wg.name, wg.params);
      })}
    </Container>
  );
}

Ví dụ#

Ví dụ