跳至主要内容

REFERENCE

SDK 範例

@asgard-js/core 與 @asgard-js/react 的用法與可以直接操作的範例。

內建 UI 多語系

SDK 自帶的介面文字——延伸思考區塊、工具呼叫分組、Task Check List、子代理面板、API Key 畫面、 File Explorer 等——透過單一個 locale prop 切換。

  1. 支援的語系​

    type Locale = "en-US" | "ja-JP" | "zh-TW";
    <Chatbot
      locale="ja-JP"
      config={{ botProviderEndpoint: "..." }}
      customChannelId="my-channel"
    />

    找不到的 key 會先退回 en-US，再退回 key 本身——所以就算某個字串還沒翻譯，畫面也不會壞掉 或出現空白。

  2. locale 管的是什麼、不管什麼​

    管不管
    SDK 自己畫的介面文字（按鈕、狀態、標籤、空狀態）bot 回覆的內容
    工具呼叫、任務、子代理面板的可讀標籤你自己傳進 initMessages 的文字
    API Key 登入畫面你用 renderFooter / renderHeader 自己畫的東西

    翻譯 bot 回覆是 bot provider 的責任，不是 SDK 的。

  3. 獨立擺放的面板​

    自行停靠的面板吃的是同一組目錄，各自收 locale：

    <TaskList tasks={tasks} locale="ja-JP" />
    <SubagentList subagents={subagents} locale="ja-JP" />

  4. 直接取用目錄​

    需要在自己的 UI 裡沿用同一批字串時：

    import { t } from "@asgard-js/react";
     
    t("ja-JP", "task.completed");
    t("zh-TW", "tool.read", { file: "src/index.ts" }); // 支援 {var} 插值

  5. 搭配站台語系​

    Docusaurus、Next.js 之類的站台通常已經有自己的 locale，對應過去即可：

    const sdkLocale = siteLocale === "en" ? "en-US" : "zh-TW";
     
    <Chatbot locale={sdkLocale} {...rest} />

  6. 也看看​

準備好開始了嗎？

想知道 Asgard 怎麼用在你的團隊？跟我們聊聊。

聯絡我們