useDatasetRef() composable

Innehåll

Syntax
Exempel
Relaterat

Composable för att skapa en reaktiv datamängd inkapslad i en Vue ref.

Datamängder är arrayer utökade med extra metadata för att hantera tillgänglighet i tabeller och listor, specifikt när datamängden är ett urval av en större mängd, och används lämpligtvis av komponenter så som datamängdsorterare (FSortFilterDataset) och tabell (FTable).

Syntax

function useDatasetRef<T>(initial, nestedAttribute);

Parametrar

initial: T[] Optional: Initialt värde. Default är en tom array.
nestedAttribute: DatasetNestedKeyOf<T> Optional: Property i element som innehåller nästlade rader.

Returvärde

Ref<Dataset<T>>: En Vue ref som kapslar in en datamängd.

Exempel

Skapa en ny datamängd:

import { useDatasetRef } from "@fkui/vue";

const dataset = useDatasetRef([
    { id: "1", name: "Äpple" },
    { id: "2", name: "Banan" },
]);

Datamängden hanterar alla vanliga operationer en array har:

console.log(dataset.value.length); // 2
console.log(dataset.value.at(0)); // { id: "1", name: "Äpple" }
console.log(dataset.value.filter((it) => it.name.startsWith("B"))); // [{ id: "2", name: "Banan" }]

Om datamängden har nästlade/expanderade rader anger man den property som innehåller de nästlade raderna:

import { useDatasetRef } from "@fkui/vue";

const rows = [
    {
        id: "1",
        name: "Äpple",
        nested: [
            { id: "1.1", name: "Pink Lady" },
            { id: "1.2", name: "Granny Smith" },
        ],
    },
    {
        id: "2",
        name: "Banan",
    },
];
const dataset = useDatasetRef(rows, "nested");

Relaterat