I am new at react flow. My goal is connect to nodes with same type. I want to have one template for node and use it everywhere.
Below simple example, but edges doesn’t appear.
If i remove type in nodes everything fine.
import { useCallback, useState } from "react";
import "reactflow/dist/style.css";
import TextUpdaterNode from "./TextUpdaterNode.js";
import "./text-updater-node.css";
const rfStyle = {
backgroundColor: "#B8CEFF"
};
const initialNodes = [
{
id: "1",
position: { x: 0, y: 0 },
type: "textUpdater"
},
{
id: "2",
position: { x: 0, y: 100 },
type: "textUpdater"
}
];
const initialEdges = [{ id: "e1-2", source: "1", target: "2", animated: true }];
const nodeTypes = { textUpdater: TextUpdaterNode };
function Flow() {
return (
<ReactFlow
nodes={initialNodes}
edges={initialEdges}
nodeTypes={nodeTypes}
fitView
style={rfStyle}
/>
);
}
export default Flow;