Vue.js on nii kergesti õpitav ja ligipääsetav raamatukogu. Niisiis, HTML-i, CSS-i ja Javascripti teadmisega saame hakata Vue-s veebirakendusi üles ehitama.js. Vue.js on loodud juba olemasoleva nurga- ja reageerimisraamistiku parimate omaduste ühendamise teel.
Andmete sidumine on Vue üks elegantsemaid omadusi.js, kuna see tagab andmete reaktiivse / kahesuunalise sidumise. Vue linnas.js, erinevalt teistest raamistikest ei pea me kahepoolse andmete sidumise jaoks kirjutama palju ridu. Ühesuunaline andmete sidumine tähendab, et muutuja on lihtsalt seotud DOM-iga. Teisalt tähendab kahesuunaline, et muutuja on seotud ka DOM-iga. Kui DOM muutub, muutub ka muutuja. Niisiis, heitkem pilk mõlemale andmesidumisele ja näeme õiget erinevust.
Ühesuunaline andmete sidumine
Kui tahame siduda mis tahes muutuja, võime lihtsalt kasutada Vue-d.js kahekordse lokkisulgude süntaks või „Vuntside“ süntaks mis tahes muutuja sidumiseks suhtelise komponendi eksemplarist.
linuxhintText
Või kui soovime siduda mis tahes muutuja HTML-atribuudis, võime kasutada v-sidumine direktiiv.
Vue.Js pakub ka HTML-atribuudis muutujate sidumise lühikirja. Kirjutamise asemel v-bind: atribuudi nimi, saame kasutada ainult koolonit “:” ja atribuudinime.
Kuid need on ainult andmete sidumised. Andmete kahepoolse sidumise demonstreerimiseks võime kasutada v-mudel Vue sätestatud direktiiv.js.
Kahesuunaline / reaktiivne andmete sidumine
Reaktiivsete andmete siduvuse demonstreerimiseks võime kasutada v-mudel sisendvormi väljal. See väljastab sisemiselt sündmuse ja muudab muutujat. Sellega saame siduda malli kuskil mujal, kasutades kahesuguseid sulgusid või „Vuntside“ süntaksit.
Sisestate teksti: linuxhintText
Nüüd, kui sisestame sisendvormi väljale märgi, näeme, et muutuja uueneb ka samaaegselt.
Pakkimine
Selles artiklis oleme õppinud Vue muutujaid siduma.js kasutades topelt lokkis trakse või “Vuntside” süntaksit. Samuti oleme demonstreerinud Vue kahesuunalist / reaktiivset andmete sidumist.js kasutades v-mudeli direktiivi. Pärast selle artikli lugemist pole andmete sidumine algajale, kes on just Vue'ga alustanud, enam keeruline ülesanne.js. Nii et jätkake Vue mõistete õppimisega.js koos linuxhintiga.com. Aitäh!