Vue.JS Mal Introduksjon

Vue.JS Mal Introduksjon

Vue.JS, som brukes til å bygge brukergrensesnitt (UIS) og en-siders applikasjon.JS fordi det gir et nøytralt miljø.

Som HTML, VUE.JS har en malsyntaks, og vi kan bruke malsyntaks for å binde DOM med komponentdataene. I denne artikkelen vil vi vise deg hvordan du setter inn data i malsyntaks og måter å interpolere forskjellige typer data.

Tekstinterpolasjon

Hvis vi ønsker å binde en variabel fra den relative komponentforekomsten, kan vi bruke doble krøllete seler, som også blir referert til som "bart" syntaks.

LinuxHintText

Vue.JS tilbyr toveisbinding, noe som betyr at når verdien av en variabel endres, vil elementet bli gjengitt igjen. Imidlertid, hvis vi ikke vil at det skal oppdateres, kan vi bruke V-en gang direktiv.

LinuxHintText

Rå HTML -interpolasjon

Vue.JS tillater ikke databinding av ren tekst, men vi kan binde rå HTML -tekst ved hjelp av V-HTML direktiv. I eksemplet nedenfor har vi en variabel i en komponent som heter Rawhtml som inneholder litt rå HTML -tekst.

data ()
komme tilbake
MSG: "Hallo Vue",
Rawhtml: "

Linuxhint er Flott

""

Vi kan binde Rawhtml variabel bruk V-HTML Direktiv som følger.

De div Tag vil ha en p Merk inni den.

Attributter interpolasjon

I den rå HTML -interpolasjonen brukte vi ikke doble krøllete seler for å binde variabelen. Derfor, hvis vi vil binde en variabel inne i HTML -attributtet, kan vi bruke v-bind direktiv.

Uttrykkene

Vue.JS gir ikke bare funksjoner for å binde en variabel. Vue.JS kan brukes til å skrive forskjellige typer uttrykk i doble krøllete seler.

count + 1
Sjekk ? "True": "falsk"
arr.sortere().revers ()

Innpakning

I denne artikkelen introduserte vi Vue.JSs enkle, men nyttige malsyntaks. Imidlertid er det mye mer å lære om Vue.JS. Du kan besøke det offisielle nettstedet til Vue.JS her, og du kan fortsette å lære om JavaScript med Linuxhint.com.