An array of tags to filter the assets.
Optional params: any = {}Additional parameters to filter and paginate assets.
The returning object contains:
assets: An array of extended asset objects.fetched: Boolean indicating whether the assets have been successfully fetched.hasMore: Boolean indicating whether there are more assets available to fetch.currentPage: The current page number of the fetched assets.fetchMore: AssetsFetchMoreMethod - Function to fetch more assets, typically for pagination.refresh: AssetsFetchMethod - Function to refresh or re-fetch the assets.import { useAssetsByTags } from 'react-playmakers';
const AssetList = () => {
const { assets, fetched, hasMore, fetchMore, refresh } = useAssetsByTags(
["3D model", "cyberpunk", "vehicle"],
{ type: "vehicle", limit: 10 }
);
useEffect(() => {
if (!fetched) {
console.log("Fetching tagged assets...");
}
}, [fetched]);
return (
<div>
<h1>Assets</h1>
{assets.length > 0 ? (
assets.map(asset => (
<div key={asset.id}>
<p>{asset.name}</p>
<button onClick={() => asset.delete()}>Delete</button>
</div>
))
) : (
<p>No assets found.</p>
)}
{hasMore && <button onClick={() => fetchMore()}>Load More</button>}
<button onClick={refresh}>Refresh</button>
</div>
);
};
export default AssetList;
Generated using TypeDoc
Custom React hook to fetch and manage assets filtered by specific tags.
This hook is a wrapper around useAssets, pre-configured to fetch assets that match the provided
tagsparameter.