<script>-tags. On cart update har en Reset to default-handling, der gendanner dens startskabelon; Initialization har ikke, så gem din egen kopi, før du rydder den.
Meget af det, forhandlere tidligere scriptede, er nu en indbygget indstilling. Tjek først Før du skriver et script: en indstilling bliver ved med at virke gennem cart-redesigns, og det gør dit script muligvis ikke.
Hvilken plads du skal bruge
Initialization
window.aftersell.cart.
Opsætningskald, du foretager her (configure(...), events.on(...), hooks.*), er sikre at kalde øverst i scriptet, selv før carten er fuldt startet; de bufres og anvendes, når den er. Handlinger, der læser eller ændrer carten (som addItem eller getCart), bør køre inde i ready() eller en event-handler.
Pladsen starter med tre udkommenterede eksempler — åbning af skuffen ved hver tilføjelse, reaktion på cart_loaded og skjulning af gratis gave-linjer — så et urørt Initialization-script gør intet. Fjern kommentering fra ét for at prøve det, eller erstat dem.
Den naturlige form for denne plads er en engangsregistrering uden events involveret: registrér adfærden én gang, og lad carten anvende den fremover. At skjule gratis gave-linjer fra skuffen, uden at ændre totalen, er det medfølgende eksempel på det:
registerLineTransform kører for hver linje, når den renderes, og setHidden er kun visning, så linjen bliver i carten og tæller stadig med i totalen, den vises bare ikke i skuffen. Se Skjul og omdøb cart-linjer for mere om, hvad en transformation kan.
Handlinger, der læser carten, skal ind i ready():
shadowRoot: carten renderes inde i en shadow root, så document.querySelector kan ikke se noget i skuffen.
On cart update
cart_updated-abonnement, så du redigerer kun kroppen, og din kode modtager den opdaterede cart.
Denne plads er til regler, der skal genevalueres ved hver cart-ændring. En tærskel for en gratis gave er det klassiske tilfælde (brug $75, få en gratis mulepose), fordi svaret afhænger af det aktuelle indhold, og intet andet kan fortælle dig, hvornår det ændres:
At holde carten i en ønsket tilstand
if (shouldHaveGift === hasGift) return; er det, der gør dette sikkert, og den generaliserer til alle scripts, der holder carten i en ønsket tilstand. Denne plads både reagerer på cart-ændringer og forårsager dem, så hvert addItem eller removeItem genindtræder i den. Beskriv den tilstand, du ønsker, sammenlign den med den tilstand, du har, og returnér tidligt, når de allerede stemmer overens, så handleren konvergerer efter én gennemgang i stedet for at loope. Se de to regler for den ubeskyttede version, du skal undgå, og hvorfor payloaden er skrivebeskyttet.
I en langsommere butik er det også værd at holde et in-flight-flag på modulniveau, så to hurtige ændringer ikke begge kan starte en tilføjelse, før den første lander.
cart_updated udløses kun ved ændringer efter den første indlæsning (event-timing), så et script i denne plads afstemmer ikke en cart, der allerede kvalificerer sig, når siden indlæses. For en version, der håndterer begge, kan du abonnere på cart_loaded og cart_updated med den samme funktion fra Initialization-pladsen. Se Tilføj automatisk en gratis gave ved en tærskel.Når et script fejler
configure, events.on eller hooks.register* længere nede aldrig registreres. Det er den sædvanlige forklaring på “min handler udløses aldrig”, når koden ser rigtig ud.
Carten angiver den fejlende linje i browserkonsollen, og hver plads kører under sit eget filnavn (aftersell-cart-init.js og aftersell-cart-cart-update.js), så du kan åbne begge fra DevTools’ Sources-panel og sætte breakpoints. Se Fejlfinding for de præcise beskeder og for debug-kanalen, der fanger hook-fejl, som holdes ude af konsollen.
Fordi cart_loaded genafspilles for sene abonnenter, betyder registreringsrækkefølgen aldrig noget. Den sikreste struktur er at registrere alt først og udføre det risikable arbejde inde i handlers, hvor et throw er isoleret til den handler.
Hvor du kan gå hen herfra
- Cart SDK: tilpassede scripts er måden, du kører SDK-kode på. Se referencerne for configure, events, actions og hooks for hele overfladen, cart-objektet for formen på det, handlers modtager, og use cases for færdige snippets.
- Custom code-blokke: til at tilføje markup til carten. Bemærk, at Custom code-blokkens HTML-tilstand ikke kører JavaScript; brug tilpassede scripts (eller blokkens React-tilstand) til logik.