嵌入式分析SDK - 集合
嵌入集合浏览器
您可以嵌入Metabase的集合浏览器，以便人们可以从您的应用程序中浏览Metabase中的项目。
CollectionBrowser
API参考
示例
import React from "react";
import { CollectionBrowser } from "@metabase/embedding-sdk-react";
export default function App() {
const collectionId = 123; // This is the collection ID you want to browse
const handleItemClick = item => {
console.log("Clicked item:", item);
};
return (
<CollectionBrowser
collectionId={collectionId}
onClick={handleItemClick}
pageSize={10}
// Define the collection item types you want to be visible
visibleEntityTypes={["dashboard", "question", "collection"]}
/>
);
}
属性
| 属性 | 类型 | 描述 |
|---|---|---|
className? |
字符串 |
要添加到根元素的自定义类名。 |
collectionId? |
SdkCollectionId |
集合的数字ID，用户个人集合的“personal”，或根集合的“root”。您可以在访问Metabase实例中的集合时从URL中找到此ID。例如，http://localhost:3000/collection/1-my-collection中的集合ID将是1。默认为“personal” |
EmptyContentComponent? |
| null | ComponentType |
集合中没有项目时显示的组件。 |
onClick? |
(item: MetabaseCollectionItem) => void |
单击项目时调用的函数。 |
pageSize? |
数字 |
每页显示的项目数量。默认值为25。 |
style? |
CSSProperties |
要添加到根元素的自定义样式对象。 |
visibleColumns? |
CollectionBrowserListColumns[] |
集合项目表中要显示的列。如果未提供，将显示所有列。 |
visibleEntityTypes? |
("model" | "question" | "collection" | "dashboard")[] |
应可见的实体类型。如果未提供，将显示所有实体。 |
隐藏集合选择器并硬编码您希望人们保存内容的集合
对于静态问题，您可以将特定集合设置为人们可以保存项目的集合，这样他们就不必费心选择集合。要硬编码一个集合：
- 将
isSaveEnabled设置为true。 - 将
targetCollection设置为您希望人们保存项目的集合ID。
有关更多选项，请参阅问题属性。
阅读其他Metabase版本的文档。