Home > Blockchain >  React flow renderer prevent specific node from being deleted
React flow renderer prevent specific node from being deleted

Time:08-30

Is there a way to prevent a specific node from being deleted? I have set deleteKeyCode={'Delete'} but want to exclude a node by type from this.

    <ReactFlow
      nodes={nodes}
      edges={edges}
      onConnect={handleOnConnect}
      onDragOver={handleOnDragOver}
      onDrop={handleOnDrop}
      connectionLineComponent={ConnectionLine}
      onNodesChange={handleOnNodesChange}
      onConnectStart={() => dispatch(setIsConnecting(true))}
      onConnectStop={() => dispatch(setIsConnecting(false))}
      onEdgesChange={handleOnEdgesChange}
      onInit={setReactFlowInstance}
      deleteKeyCode={'Delete'}
      defaultZoom={1}
      nodeTypes={customNodeTypes}
      edgeTypes={customEdgeTypes}>
      <Background className={classes.flowBackground} />
      <Controls />
    </ReactFlow>

CodePudding user response:

Instead of hard-coding the string 'Delete', use a variable who's value changes from a blank '' to 'Delete' depending on whether or not you want to exclude the node from deletion:

const isDeleting = 'Yes' ? 'Delete' : '';

deleteKeyCode={isDeleting}

  • Related