Pereiti prie pagrindinio turinio

Data Table

Komponentas, atvaizduojantis duomenis lentelių pavidalu. Sukurtas ant react-table.

Parinktys

  • data | (array|object) (required): Peržiūrimas duomenų objektas arba masyvas. Jei tai objektas, raktai atitinka stulpelių reikšmes, o iš masyvo tikimasi gauti objektų masyvą, kuriame kiekvienam stulpeliui atitinka pavadintas laukas.. Default: none.
  • dataInfo | object: objektas, kuriame yra info eilutės masyvas, apibūdinantis duomenų rinkinį, duomenų rinkinio pavadinimas, kintamųjų objektas, kurio raktai atitinka kintamųjų pavadinimus, o reikšmės - kintamųjų aprašymus, ir showOnStartup loginis veiksnys, kontroliuojantis, ar paleidimo metu turi būti rodomas informacinis modalinis langas.. Default: { 'info': [], 'name': '', 'variables': null, 'showOnStartup': false }.
  • deletable | boolean: kontroliuoja, ar stulpeliai, kuriems nėra info, turi mygtuką, kurį paspaudus iškviečiama onColumnDelete grįžtamojo ryšio funkcija.. Default: false.
  • undeletableVars | array<string>: stulpelių, kurių negalima ištrinti, kintamųjų vardų masyvas. Default: [].
  • filterable | boolean: kontroliuoja, ar stulpelius galima filtruoti.. Default: true.
  • editable | array: redaguojamų stulpelių pavadinimų masyvas. Default: [].
  • getTrProps | function: atšaukimo funkcija, vykdoma kiekvienai eilutei, kad būtų pritaikytas jos stilius (perduota lentelės būsena, eilutės informacija, stulpelis ir lentelės egzempliorius). Default: none.
  • onColumnDrag | function: funkcija, iškviečiama, kai stulpelis vilkiamas į kitą padėtį. Default: onColumnDrag() {}.
  • onColumnDelete | function: funkcija, iškviečiama su stulpelio pavadinimu, kai paspaudžiamas atitinkamas stulpelio šalinimo mygtukas.. Default: onColumnDelete() {}.
  • onColumnNameChange | function: funkcija, iškviečiama pakeitus stulpelio pavadinimą (iškviečiama, kai pirmasis argumentas yra senasis pavadinimas, o antrasis - naujasis pavadinimas).. Default: onColumnNameChange() {}.
  • onClickRemove | function: funkcija, nurodanti veiksmą, kurį reikia atlikti iš duomenų pašalintoms eilutėms (numatytoji reikšmė - tuščia funkcija).. Default: onClickRemove() {}.
  • onEdit | function: funkcija, iškviečiama su atnaujintu duomenų rinkiniu po to, kai naudotojas pakeitė langelio reikšmę (taikoma tik tada, kai lentelė yra redaguojama).. Default: onEdit() {}.
  • onTutorialCompletion | function: funkcija, iškviečiama, kai naudotojas baigia duomenų lentelės vadovėlį.. Default: onTutorialCompletion() {}.
  • filters | array: filtrų masyvas. Default: [].
  • onFilteredChange | function: funkcija, iškviečiama su dabartiniais filtrais po to, kai duomenis filtravo naudotojas. Default: onFilteredChange() {}.
  • showRemove | boolean: nurodo, ar rodyti pašalintinų eilučių žymimuosius langelius.. Default: false.
  • showIdColumn | boolean: kontroliuoja, ar rodyti ID stulpelį.. Default: true.
  • disableDownload | boolean: ar paslėpti mygtuką, skirtą duomenims atsisiųsti CSV arba JSON failo pavidalu.. Default: false.
  • className | string: klasės pavadinimas. Default: ''.
  • style | object: Objektas, leidžiantis naudoti pasirinktinį css stilių. Numatytoji reikšmė - tuščias objektas. Default: {}.

Pavyzdžiai

Tiesioginis redaktorius
Rezultatas
ReferenceError: Provider is not defined