| | |
| | | import React, { useEffect, useRef, useState } from "react"; |
| | | import { Graph, Shape } from "@antv/x6"; |
| | | import { GraphComponent } from "../../components/Flow/GraphComponent"; |
| | | import { GraphTools } from "../../components/Flow/GraphTools"; |
| | | import { RightMenu } from "../../components/Flow/RightMenu"; |
| | | import { GraphDrawer } from "../../components/Flow/GraphDrawer"; |
| | | import './index.less'; |
| | | |
| | | const Home = () => { |
| | | export default function () { |
| | | const graphRef = useRef(null); |
| | | const [ready, setReady] = useState(false); |
| | | |
| | | const initHandle = () => { |
| | | setReady(true); |
| | | } |
| | | |
| | | useEffect(() => { |
| | | if (ready) { |
| | | // 你需要在loading状态改变后执行的代码 |
| | | console.log('graphRef is ready:', graphRef.current); |
| | | } |
| | | }, [ready]); |
| | | |
| | | return ( |
| | | <> |
| | | <h1>Home</h1> |
| | | </> |
| | | ) |
| | | } |
| | | |
| | | export default Home; |
| | | <div className="stencil-app"> |
| | | <GraphTools isReady={ready} graphRef={graphRef} /> |
| | | <GraphComponent ref={graphRef} initHandle={initHandle} /> |
| | | <RightMenu isReady={ready} graphRef={graphRef} /> |
| | | <GraphDrawer isReady={ready} graphRef={graphRef} /> |
| | | </div> |
| | | ); |
| | | } |