Fix(Render): Fix can not render device node when entering the page

This commit is contained in:
2024-11-03 12:05:55 +08:00
parent a33a405a07
commit f491268c62

View File

@@ -45,23 +45,7 @@ const Render = ({
const [isLoaded, setIsLoaded] = useState(false) const [isLoaded, setIsLoaded] = useState(false)
const [selectedDevice, setSelectedDevice] = useState<DeviceName>('Pixel 7') const [selectedDevice, setSelectedDevice] = useState<DeviceName>('Pixel 7')
const [isRotate, setIsRotate] = useState(false) const [isRotate, setIsRotate] = useState(false)
const [nodes, setNodes] = useState<Node<SimulationData>[]>([])
const nodes: Node<SimulationData>[] = [
{
id: 'device',
type: 'simulation',
position: { x: 0, y: 0 },
data: {
deviceWidth: devices[selectedDevice].width,
deviceHeight: devices[selectedDevice].height,
isRotate,
iframeKey,
iframeRef,
iframeUrl,
setIsLoaded
}
}
]
const handleOnRotateDevice = () => { const handleOnRotateDevice = () => {
setIsRotate(!isRotate) setIsRotate(!isRotate)
@@ -98,6 +82,25 @@ const Render = ({
loadGlobalVariables() loadGlobalVariables()
}, [isLoaded, globalJsVariables, globalCssVariables]) }, [isLoaded, globalJsVariables, globalCssVariables])
useEffect(() => {
setNodes([
{
id: 'device',
type: 'simulation',
position: { x: 0, y: 0 },
data: {
deviceWidth: devices[selectedDevice].width,
deviceHeight: devices[selectedDevice].height,
isRotate,
iframeKey,
iframeRef,
iframeUrl,
setIsLoaded
}
}
])
}, [])
return mobileMode ? ( return mobileMode ? (
<> <>
<ReactFlow <ReactFlow