React Dayo
A Queue component for notification etc.
Usage
/**
* To prepare of using the `react-dayo`.
* It requires `react@^16.8.0`, `@types/react`, `styled-components@^4.2.0` and `@types/styled-components`.
* And you will need `react-dom` and `@types/react-dom` too
*
* ```sh
* yarn add react-dayo react @types/react react-dom react @types/react-dom styled-components @types/styled-components
* ```
*/
import {createDayo} from 'react-dayo';
/**
* If you intent to use `log` which is one of the preset.
* You also write the following like.
*/
import log from 'react-dayo/dist/main/mods/seed/presets/alerts/log';The Directory structure is looked at here.
Example
First write the markup.
<!DOCTYPE html>
<html lang="en">
<head>
<!-- omit -->
</head>
<body>
<div id="app"><!-- For to mount your react app --></div>
<div id="dayobox">
<!-- For to mount <Dayo /> in here with `ReactDom.createPortal` -->
</div>
</body>
</html>const [Dayo, dispatch] = createDayo();
ReactDom.render(
(
<div>
{/* ...nest... */}
<div>
<button onClick={dispatch(log.message('Hello by Dayo'))}>button</button>
</div>
{ReactDom.createPortal(<Dayo />, document.getElementById('dayobox'))}
{/* ...nest... */}
</div>
)
document.getElementById('app')
)
Creat custom seed
todo
Archive
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent