kylefang/react
1
0
Fork 0
mirror of https://github.com/zhigang1992/react.git synced 2026-02-09 22:50:06 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #41 from nocategory/update-docs

Browse Source 
docs: fix switch themes code
This commit is contained in:
witt
2020-03-30 06:13:53 +08:00
committed by GitHub
parent a1434a5480 32a854f8c0
commit 5cbb5cc7f7
1 changed files with 12 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
pages/docs/customization/themes.mdx
View File

@@ -28,21 +28,20 @@ export const meta = {
3. Update the value of `theme.type`, and the theme of all components will follow automatically.
```jsx
import { CSSBaseline, ZEITUIProvider, useTheme } from '@zeit-ui/react'
import { CSSBaseline, ZEITUIProvider } from '@zeit-ui/react'
const [type, setType] = useState('light')
const currentTheme = useTheme()
const switchThemes = () => () => {
const nextTheme = currentTheme.type === 'dark' ? 'light' : 'dark'
setType(nextTheme)
const App = () => {
const [themeType, setThemeType] = useState('dark')
const switchThemes = () => {
setThemeType(lastThemeType => lastThemeType === 'dark' ? 'light' : 'dark')
}
return (
<ZEITUIProvider theme={{ type: themeType }}>
<CSSBaseline />
<YourComponent onClick={switchThemes} />
</ZEITUIProvider>
)
}
const App = () => (
<ZEITUIProvider theme={{ type }}>
<CSSBaseline />
<YourAppComponent onClick={switchThemes}/>
</ZEITUIProvider>
)
```
<Spacer y={3} />