Udfordring: Hent og Vis Data
Lad os fokusere på den næste komponent, LatestInvoices. Dens formål er at vise de seneste fem fakturaer, sorteret kronologisk efter dato.
Det kan virke oplagt at løse dette med JavaScript. Men efterhånden som appen vokser, og der kommer flere data til, er det at foretrække at håndtere sortering og begrænsning af fakturaer med SQL. Denne tilgang forhindrer, at frontend'en bliver overbelastet med unødvendige beregninger.
For at undersøge funktionen fetchLatestInvoices, besøg venligst app/lib/data.ts.
Tilbage til projektet
Vi vil anvende funktionen fetchLatestInvoices på dashboard-siden for at hente de nyeste fakturaer og vise dem med komponenten LatestInvoices.
Husk at besøge app/ui/dashboard/latest-invoices.tsx og fjerne kommenteringen af det medfølgende UI.
Udfordring
Nu er det din tur til at hente dataene og præsentere informationen for brugeren.
På dashboard-siden har vi primært en Card-komponent. Din opgave er at importere funktionen fetchCardData, som leverer:
numberOfSellers;numberOfInvoices;totalFulfilledInvoices;totalAwaitingInvoices.
Baseret på de hentede data skal du fjerne kommenteringen af den tilsvarende Card-komponent.
Resultat
I praksis
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat
Can you explain how the fetchLatestInvoices function works?
Where can I find the LatestInvoices component code?
What should I do if the LatestInvoices component doesn't display any data?
Awesome!
Completion rate improved to 2.08Udfordring: Hent og Vis Data
Stryg for at vise menuen
Lad os fokusere på den næste komponent, LatestInvoices. Dens formål er at vise de seneste fem fakturaer, sorteret kronologisk efter dato.
Det kan virke oplagt at løse dette med JavaScript. Men efterhånden som appen vokser, og der kommer flere data til, er det at foretrække at håndtere sortering og begrænsning af fakturaer med SQL. Denne tilgang forhindrer, at frontend'en bliver overbelastet med unødvendige beregninger.
For at undersøge funktionen fetchLatestInvoices, besøg venligst app/lib/data.ts.
Tilbage til projektet
Vi vil anvende funktionen fetchLatestInvoices på dashboard-siden for at hente de nyeste fakturaer og vise dem med komponenten LatestInvoices.
Husk at besøge app/ui/dashboard/latest-invoices.tsx og fjerne kommenteringen af det medfølgende UI.
Udfordring
Nu er det din tur til at hente dataene og præsentere informationen for brugeren.
På dashboard-siden har vi primært en Card-komponent. Din opgave er at importere funktionen fetchCardData, som leverer:
numberOfSellers;numberOfInvoices;totalFulfilledInvoices;totalAwaitingInvoices.
Baseret på de hentede data skal du fjerne kommenteringen af den tilsvarende Card-komponent.
Resultat
I praksis
Tak for dine kommentarer!
