change workspace key generate method

if use useCallback, Workspace will reload when switch theme
This commit is contained in:
Qing 2022-06-29 21:47:26 +08:00
parent 54289ea66d
commit 15dcb43f69

View File

@ -1,4 +1,4 @@
import React, { useCallback, useEffect, useState } from 'react' import React, { useEffect, useMemo } from 'react'
import { useKeyPressEvent } from 'react-use' import { useKeyPressEvent } from 'react-use'
import { useRecoilState } from 'recoil' import { useRecoilState } from 'recoil'
import { nanoid } from 'nanoid' import { nanoid } from 'nanoid'
@ -34,18 +34,14 @@ function App() {
document.body.setAttribute('data-theme', theme) document.body.setAttribute('data-theme', theme)
}, [theme]) }, [theme])
const getWorkspaceKey = useCallback(() => { const workspaceId = useMemo(() => {
return nanoid() return nanoid()
}, [file]) }, [file])
return ( return (
<div className="lama-cleaner"> <div className="lama-cleaner">
<Header /> <Header />
{file ? ( {file ? <Workspace file={file} key={workspaceId} /> : <LandingPage />}
<Workspace file={file} key={getWorkspaceKey()} />
) : (
<LandingPage />
)}
</div> </div>
) )
} }