Web SDK
- 概要
- はじめに
- v4からv5への移行
- ガイド
- フック
- 二次販売マーケットプレイス
- カスタム構成
- カスタムコネクタ
ゲームエンジンSDK
- Unity
- Unreal
その他のSDK
- Typescript
- Go
- モバイル
フック
マーケットプレイスデータフック
主要なマーケットプレイスデータを取得するためのGETフックのコレクションです。UIでマーケットプレイス情報を取得・管理するのに便利です。
useMarketplaceConfig
useMarketplaceConfigフックは、Builderからコレクション、SNSリンク、タイトル、その他の設定など、マーケットプレイスの構成情報を取得します。
import { useMarketplaceConfig } from "@0xsequence/marketplace-sdk/react";
## Into your React component:
const data = useMarketplaceConfig();
useMarketplaceConfig
* return properties
マーケットプレイス発行者の一意の識別子。
マーケットプレイスのタイトル。
マーケットプレイスの簡単な説明。
マーケットプレイスに関連するSNSリンク。
マーケットプレイスのファビコンのURL。
ランディングページ用マーケットプレイスバナーのURL
マーケットプレイスのコレクション配列。
ウォレット連携のための設定オプション。
マーケットプレイスのランディングページ用レイアウト設定。
マーケットプレイスのロゴURL。
マーケットプレイスのバナーURL。
マーケットプレイスで使用されるカスタムフォントのURL。
ogImageのURL
マーケットプレイス用のカスタムCSSスタイル。
マーケットプレイスのマニフェストファイルのURL。
useListCollectibles
useListCollectiblesフックは、マーケットプレイスのコレクション内の現在の出品やオファーを取得します。出品やオファーを効率的に管理・取得するのに役立ちます。
import { OrderSide } from '@0xsequence/marketplace-sdk';
import { useListCollectibles } from '@0xsequence/marketplace-sdk/react';
## Into your React component:
const {
data: collectibles,
isLoading: collectiblesLoading,
fetchNextPage: fetchNextCollectibles,
} = useListCollectibles({
chainId,
collectionAddress,
filter: {
// # Optional filters
includeEmpty,
searchText,
properties,
},
side: OrderSide.listing,
});
const collectiblesFlat =
collectibles?.pages.flatMap((p) => p.collectibles) ?? [];
return (
<div>
{collectiblesFlat?.map((collectible) => (
// Your Collectibles component
))}
</div>
);
useListCollectibles
* params
interface UseListCollectiblesArgs {
chainId: string;
side: OrderSide;
collectionAddress: `0x${string}`;
page?: {
page: number;
pageSize: number;
sort?: {
order: SortOrder$1;
column: string;
}[];
more?: boolean;
};
filter?: {
includeEmpty: boolean;
searchText?: string;
properties?: {
type: PropertyType;
name: string;
values?: any[];
max?: number;
min?: number;
}[];
marketplaces?: MarketplaceKind[];
inAccounts?: string[];
notInAccounts?: string[];
ordersCreatedBy?: string[];
ordersNotCreatedBy?: string[];
};
query?: {
enabled?: boolean;
};
}
* return properties
useListCollectiblesPaginated
useListCollectiblesPaginatedフックは、マーケットプレイスから現在の出品やオファーを効率的に取得・管理します。コレクション内でページ分割されたNFTを表示するのに最適です。
import { OrderSide } from '@0xsequence/marketplace-sdk';
import { useListCollectiblesPaginated } from '@0xsequence/marketplace-sdk/react';
const chainId = 137;
const searchText = "";
const enabled = true;
const includeEmpty = true;
const properties = [];
const pageSize = 30;
const currentPage = 1;
const collectionAddress = "0x0e5566a108e617baedbebb44e3fcc7bf03e3a839";
## Into your React component:
const {
data: collectiblesResponse,
isLoading: collectiblesLoading,
} = useListCollectiblesPaginated({
chainId: String(chainId),
collectionAddress,
side: OrderSide.listing,
filter: {
// # Optional filters
includeEmpty,
searchText,
properties,
},
page: {
page: currentPage,
pageSize,
},
query: {
page: currentPage,
pageSize,
enabled,
},
});
const collectiblesList = collectiblesResponse?.collectibles ?? [];
return (
<div>
{collectiblesList?.map((collectible) => (
// Your Collectibles component
))}
</div>
);
useListCollectiblesPaginated details
* params
interface UseListCollectiblesPaginatedArgs {
chainId: string;
side: OrderSide;
collectionAddress: `0x${string}`;
page?: {
page: number;
pageSize: number;
sort?: {
order: SortOrder$1;
column: string;
}[];
more?: boolean;
};
filter?: {
includeEmpty: boolean;
searchText?: string;
properties?: {
type: PropertyType;
name: string;
values?: any[];
max?: number;
min?: number;
}[];
marketplaces?: MarketplaceKind[];
inAccounts?: string[];
notInAccounts?: string[];
ordersCreatedBy?: string[];
ordersNotCreatedBy?: string[];
};
query: {
page: number;
pageSize: number;
enabled?: boolean;
};
}
* return properties
useCountOfCollectables
useCountOfCollectablesフックは、コレクション内のNFT数を返します。
import { OrderSide } from '@0xsequence/marketplace-sdk';
import { useCountOfCollectables } from '@0xsequence/marketplace-sdk/react';
const countOfCollectables = useCountOfCollectables({
chainId,
collectionAddress,
side: OrderSide.listing,
filter: {
searchText: text,
includeEmpty,
properties,
},
});
useCountOfCollectables details
* params
interface UseCountOfCollectables {
chainId: ChainId;
collectionAddress: CollectionAddress;
query?: { enabled?: boolean };
filter?: {
includeEmpty: boolean;
searchText?: string;
properties?: {
name: string;
type: PropertyType;
min?: number;
max?: number;
values?: any[];
}[];
marketplaces?: MarketplaceKind[];
inAccounts?: string[];
notInAccounts?: string[];
ordersCreatedBy?: string[];
ordersNotCreatedBy?: string[];
};
side?: OrderSide;
}
* return properties
このページは役に立ちましたか?