This is a toast message function for React development notifications
^1.1.0 support react >=18.0.0 <20.0.0
- Supports queue block list
- Plug and unplug using
@acrool/react-portalandframer-motion
yarn add @acrool/react-block
add in your index.tsx
import "@acrool/react-block/dist/index.css";add in your App.tsx
import {BlockPortal} from "@acrool/react-block"; const App = () => { return ( <div> <BaseUsed/> <BlockPortal isVisibleQueueKey={false} loader={<Loader/>} defaultMessage="Loading..." /> </div> ); };
then in your page
import {block} from '@acrool/react-block'; import {useEffect} from "react"; const Example = () => { useEffect(() => { block.show(); setTimeout(() => { block.hide(); }, 3000) }, []); return ( <div> sample page </div> ); };
- block.show
- block.hide
There is also a example that you can play with it: