react-bootstrap-table/react-bootstrap-table2

Display column Type.CHECKBOX as checkbox even when not being edited

Open

#784 aperta il 6 feb 2019

Vedi su GitHub
 (4 commenti) (0 reazioni) (0 assegnatari)JavaScript (415 fork)batch import
cell-editorhelp wanted

Metriche repository

Star
 (1249 star)
Metriche merge PR
 (Nessuna PR mergiata in 30 g)

Descrizione

In the table I'm using, it's quite natural to display a true/false state as a checked or unchecked checkbox. This doesn't seem to be supported out of the box but by using a formatter which renders it as a checkbox I can make it work. It takes an extra click to make it editable and it will then change state as expected.

Is there a way to render this that doesn't require the extra click?

Thanks,

  Ben.

const columns = [
   ..., {
        dataField: 'selected',
        text: 'Selected',
        formatter: (cell) => <Checkbox checked={cell} />,
        editor: {
            type: Type.CHECKBOX
        }
    }
];

Guida contributor

Direzione di ricerca
La richiesta del problema è che una colonna con tipo di editor Type.CHECKBOX dovrebbe visualizzare una casella di controllo anche quando non è in modalità di modifica. Indaga il codice sorgente nel repository react bootstrap table2, concentrandoti su come vengono renderizzate le colonne e su come vengono attivati/disattivati gli editor. Controlla i componenti del formattatore di colonna e dell'editor, in particolare la gestione di Type.CHECKBOX. Se disponibili, esamina gli esempi nella directory 'packages/react bootstrap table2 example'. La soluzione probabilmente comporta la modifica del renderer di cella per visualizzare un componente Checkbox quando la cella non è in fase di modifica, in base al valore della cella. Considera l'aggiunta di una prop come 'alwaysShowCheckbox' o la modifica del formattatore predefinito per il tipo checkbox.
Tech stack
javascriptreact
Dominio
frontend
Tipo issue
Funzionalità
DifficoltàQuanto dovrebbe essere impegnativa per un nuovo contributor.
2
Tempo stimatoTempo stimato per completare e verificare uno scope piccolo.
Mezza giornata
Stato attivitàQuanto è probabile che la issue sia ancora attiva e reviewable.
Datata
ChiarezzaQuanto chiaramente la issue descrive problema, scope e risultato atteso.
Abbastanza chiara
Prerequisiti
Basic knowledge of ReactFamiliarity with react bootstrap table2
Adatta ai principiantiQuanto la issue è adatta a contributor alla prima esperienza.
40