53 lines
1.1 KiB
JavaScript
53 lines
1.1 KiB
JavaScript
import { Button } from '@mui/material'
|
|
import { orange } from '@mui/material/colors'
|
|
import React, { useCallback } from 'react'
|
|
import { useDispatch } from 'react-redux'
|
|
|
|
const Home = () => {
|
|
const dispatch = useDispatch()
|
|
|
|
const addCount = useCallback(() => {
|
|
dispatch({ type: 'ADD_COUNT' })
|
|
}, [dispatch])
|
|
|
|
const delCount = useCallback(() => {
|
|
dispatch({ type: 'DEL_COUNT' })
|
|
}, [dispatch])
|
|
|
|
const changeTheme = useCallback(() => {
|
|
dispatch({
|
|
type: 'THEME_UPDATE',
|
|
palette: {
|
|
primary: {
|
|
main: orange[500],
|
|
},
|
|
},
|
|
})
|
|
}, [dispatch])
|
|
|
|
const resetTheme = useCallback(() => {
|
|
dispatch({
|
|
type: 'THEME_RESET',
|
|
})
|
|
}, [dispatch])
|
|
|
|
return (
|
|
<div>
|
|
<h3>home page</h3>
|
|
<Button variant='outlined' onClick={addCount}>
|
|
add
|
|
</Button>
|
|
<Button variant='outlined' onClick={delCount}>
|
|
del
|
|
</Button>
|
|
<Button variant='outlined' onClick={changeTheme}>
|
|
change
|
|
</Button>
|
|
<Button variant='outlined' onClick={resetTheme}>
|
|
reset
|
|
</Button>
|
|
</div>
|
|
)
|
|
}
|
|
export default Home
|