Arrastar Caixa
Cria um elemento de início de arrasto que pode ser solto no SplitScreen e, se necessário, também pode ser usado como uma fonte pura de Drag & Drop.
Uso básico
FlexLayoutSplitScreenDragBoxos filhos de são a UI que o usuário interage, targetComponenté a tela real que entrará no split screen após o drop.
navigationTitle apenas transmite dados de rótulo.
O navigationTitle do DragBox é o dado de rótulo da tela solta. O DragBox não mantém renderizadores de título como navigationTitleComponent, e o design real do título é determinado pelo navigationTitleComponent do FlexLayoutSplitScreen alvo.
Cancelar arrasto com Escape.
Se você pressionar Escape durante o arrasto, cancela o arrasto atual. Limpa o clone e o estado de arrasto pendente, propagando isDragging false / isDrop false, fazendo com que as instruções de divisão do Split Screen desapareçam imediatamente e dropEndCallback ou divisão de tela não sejam executados.
Renderização de URL no Next.js
Ao importar do ponto de entrada exclusivo do Next.js, você pode passar apenas a URL em vez de targetComponent. O iframe é false por padrão e, quando false, renderiza no servidor através do registry e Provider gerados.
drop fora do documento
dropDocumentOutsideOptionAo fornecer , você pode configurar uma ação para abrir uma nova janela/aba ao soltar fora do documento.
Props frequentemente usados
navigationTitle
drop 후 화면에 붙는 라벨 데이터입니다. 타이틀 UI 스타일은 수신하는 FlexLayoutSplitScreen이 담당합니다.
dropEndCallback
drop이 끝난 뒤 x, y, containerName을 받아 후처리합니다.
isBlockingActiveInput
input/textarea/select/contenteditable 등 active 입력 요소에서 drag 시작을 막을지 제어합니다. 기본값은 false입니다.
customData
드래그 중 함께 전달할 string/number/boolean 기반의 커스텀 데이터입니다.
scrollTargetRef
드래그 중 viewport edge auto-scroll 대신 특정 scroll container를 대상으로 삼을 때 사용합니다.