Function useTutorials

  • Custom React hook to fetch and manage tutorial assets.

    This hook is a wrapper around useAssets, pre-configured to fetch assets of type "tutorial" by setting the type parameter to "tutorial".

    Parameters

    • Optional params: any = {}

      Additional parameters to filter and paginate tutorials.

    Returns UseAssetsReturn

    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.

    Example

    import { useTutorials } from 'react-playmakers';

    const TutorialList = () => {
      const { assets, fetched, hasMore, fetchMore, refresh } = useTutorials({ limit: 10, tags: ["3D model"] });

      useEffect(() => {
        if (!fetched) {
          console.log("Fetching tutorials...");
        }
      }, [fetched]);

      return (
        <div>
          <h1>Tutorials</h1>
          {assets.length > 0 ? (
            assets.map(tutorial => (
              <div key={tutorial.id}>
                <p>{tutorial.name}</p>
                <button onClick={() => tutorial.delete()}>Delete</button>
              </div>
            ))
          ) : (
            <p>No tutorials found.</p>
          )}

          {hasMore && <button onClick={() => fetchMore()}>Load More</button>}
          <button onClick={refresh}>Refresh</button>
        </div>
      );
    };

    export default TutorialList;

Settings

Member Visibility

Theme

Generated using TypeDoc