Create App.js
Browse files- src/App.js +24 -0
src/App.js
ADDED
|
@@ -0,0 +1,24 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
import React, { useEffect, useState } from 'react';
|
| 2 |
+
import ReactFlow from 'reactflow';
|
| 3 |
+
import 'reactflow/dist/style.css';
|
| 4 |
+
|
| 5 |
+
function App() {
|
| 6 |
+
const [elements, setElements] = useState([]);
|
| 7 |
+
|
| 8 |
+
useEffect(() => {
|
| 9 |
+
fetch('/api/data')
|
| 10 |
+
.then(response => response.json())
|
| 11 |
+
.then(data => {
|
| 12 |
+
const { nodes, edges } = data;
|
| 13 |
+
setElements([...nodes, ...edges]);
|
| 14 |
+
});
|
| 15 |
+
}, []);
|
| 16 |
+
|
| 17 |
+
return (
|
| 18 |
+
<div style={{ width: '100vw', height: '100vh' }}>
|
| 19 |
+
<ReactFlow elements={elements} />
|
| 20 |
+
</div>
|
| 21 |
+
);
|
| 22 |
+
}
|
| 23 |
+
|
| 24 |
+
export default App;
|