Seleção de grade de React

    A Ignite UI for React Data Table/Data Grid oferece suporte à seleção de uma ou várias linhas e células.

    React Grid Selection Example

    Visão geral

    A seleção na grade de dados React é ativada em nível de linha e célula e pode ser configurada usando aselectionMode opção da grade React. Essa propriedade aceita cinco opções diferentes, listadas abaixo:

    • None: A seleção não está ativada.
    • SingleCell: A seleção de uma única célula está habilitada.
    • SingleRow: A seleção de uma única linha está ativada.
    • MultipleCell: A seleção de múltiplas células está habilitada.
    • MultipleRow: A seleção de múltiplas linhas está ativada.
    • RangeCell: A seleção de uma faixa de múltiplas células clicando e arrastando está ativada.

    selectionBehaviorpadrão paraModifierBased, onde apenas uma linha ou célula é selecionada por vez e as teclas modificadoras (CTRL) são necessárias para selecionar múltiplas itens.selectionBehavior Configurado paraToggle permitir que múltiplas linhas ou células sejam selecionadas apenas com um único clique.

    MultipleRowinclui a seguinte funcionalidade:

    • Clique e arraste para selecionar linhas
    • SHIFT e clique para selecionar várias linhas.
    • SHIFT e pressione as teclas + seta para selecionar várias linhas.

    Pressionar a barra de espaço alterna a seleção da linha ativa viaMultipleRow ouSingleRow.

    Row Range Selection

    O exemplo a seguir demonstra como selecionar ou desmarcar todas as linhas da grade. Nota queselectionMode deve ser configurado para Múltiplas Linhas.

    API References