Vue.js on hõlpsasti õpitav ja hõlpsasti ligipääsetav teek, milles saame veebiarenduse põhiteadmistega hakata veebirakendusi ehitama. Vue linnas.js, arendajad armastavad rakenduste arendamise ajal kodeerida ja tunnevad vabadust.

Igas dünaamilises veebirakenduses on tingimuslik renderdamine vajalik osa. Vue.js pakub tingimisi renderdamiseks erinevaid viise ja me võime kasutada mõnda järgmistest viisidest, mis sobivad meie eesmärgiga:

• v-saade
• v-kui
• v-muu

Selles artiklis proovime neid Vue pakutavaid direktiive.js tingimusliku renderdamise jaoks ja mõistke neid paremini.

v-saade

V-show peidab elemendi ainult selle nähtavuse keelamise kaudu. See peidab elemendi, kui edastatud avaldise või muutuja väärtus pole tõene.

Näiteks:

See lõik pole peidetud

See lõik on peidetud

v-kui

Teiselt poolt ei varja v-if elementi, kuid ei renderda ka midagi enne, kui edastatud avaldise või muutuja väärtus tõeks saab.

Näiteks:

V-if direktiivis on v-show direktiiviga võrreldes täiendav funktsioon. Saame seda rakendada ka malliplokile, kui me ei soovi selle ploki vahele midagi renderdada. Kas selles on lapsekomponent või palju muid elemente.

Näiteks:

v-muu

Mõlemast kahest plokist tingimuslikult renderdamiseks võime kasutada ka v-else direktiivi ja v-if lauset. Kuid pidades meeles, et v-else-plokk peab ilmuma kohe pärast v-if-plokki.

Näiteks:

See lõik renderdatakse, kui 'isVar' saab tõeks

Muidu see lõik renderdatakse.

V-else saame rakendada ka malliplokile.

v-veel-kui

Nii nagu v-else, võime ka v-if-direktiivi kasutada koos v-if-direktiiviga.

Näiteks:

v-kui vs. v-saade

V-if ja v-show teevad sama ülesande. Mõlemad peidavad DOM-is elemente, lähtudes edastatud avaldise tõesusest või valest väärtusest, kuid peitmise ja elementide renderdamata jätmise erinevusega.

Kui võrrelda nende kahe aja- ja töötlemiskulusid. V-if maksab käitamise või lülitamise ajal rohkem, samas kui v-show maksab renderdamise alguses. Seega oleks mõistlik kasutada v-showd, kui lülitamine on otstarbekas. Vastasel juhul eelistatakse v-if.

Pakkimine

Selles artiklis oleme õppinud, kuidas tingimuslikult VOM-is DOM-i renderdada.js kasutades v-if ja v-else direktiive. Oleme näidanud mõningaid näiteid ja õppinud tundma v-show ja v-if direktiivi tegelikku erinevust. Kui see artikkel aitab teil paremini mõista ja mõista kontseptsioone, jätkake linuxhinti külastamist.com sellise kasuliku sisu jaoks.