Mở một Mini App

Tbox Mini App cho phép Nhà Phát Triển có thể nhảy từ Mini App này sang Mini App khác.

Nhà Phát Triển có thể nhảy tới một Mini App bất kỳ thông qua API openMiniApp.

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

Trong ứng dụng DSHome, có rất nhiều icon trỏ tới từng Mini App khác nhau. Khi người dùng click vào một icon, tuỳ vào icon đó là Mini App nào, Tbox Mini App sẽ mở ra Mini App đó cho người dùng.

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

Hàm openMiniApp nhận vào 3 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 Mini App
page	string	không	tên của page trong Mini App. Nếu không truyền vào, giá trị mặc định sẽ là page home
params	object	không	danh sách các parameters được truyền cho page này, giá trị mặc định là {}

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, { useState, useEffect } from "react";
import tbox from "tbox";
import { Button } from "tbox/ui";

function AppItem({ appId, page, params }) {
  const handleClick = () => {
    tbox.openMiniApp(appId, page, params);
  };

  return (
    <ItemContainer onClick={handleClick}>
      <Image src={`https://cdn.tiki.vn/apps/${appId}/icon.png`} />
    </ItemContainer>
  );
}

function ListIcon() {
  const apps = [
    {
      appId: 1,
      params: {},
    },
    {
      appId: 2,
      params: {},
    },
    {
      appId: 3,
      params: {},
    },
  ];

  return (
    <Container>
      {apps.map((app) => {
        return <AppItem {...app} />;
      })}
    </Container>
  );
}

Ví dụ#

Ví dụ