Vue.js je tako laka za učenje i pristupačna biblioteka. Dakle, sa znanjem HTML-a, CSS-a i Javascripta, možemo započeti izgradnju web aplikacija u Vueu.js. Vue.js je izgrađen kombiniranjem najboljih značajki iz već postojećeg okvira Angular and response.
Povezivanje podataka jedna je od najelegantnijih značajki Vuea.js jer pruža reaktivno / dvosmjerno vezivanje podataka. U Vueu.js, ne moramo pisati puno redaka da bismo imali dvosmjerno vezivanje podataka, za razliku od ostalih okvira. Jednosmjerno vezivanje podataka znači da je varijabla samo vezana za DOM. S druge strane, dvosmjernost znači da je varijabla također vezana uz DOM. Kada se promijeni DOM, promijeni se i varijabla. Dakle, pogledajmo oba povezivanja podataka i uvidimo pravu razliku.
Jednosmjerno vezivanje podataka
Ako želimo vezati bilo koju varijablu, možemo jednostavno koristiti Vue.js sintaksa dvostrukih kovrčavih zagrada ili sintaksa “Brkovi” za povezivanje bilo koje varijable iz relativne instance komponente.
linuxhintText
Ili, ako želimo vezati bilo koju varijablu unutar HTML atributa, možemo koristiti v-vezati direktiva.
Vue.js također nudi skraćenicu za vezivanje varijabli u HTML atributu. Umjesto da pišem v-bind: atribut-ime, možemo koristiti samo dvotačku ":" i naziv atributa.
Ali to su samo vezivanja podataka. Da bismo demonstrirali dvosmjerno vezivanje podataka, možemo koristiti v-model direktivu koju daje Vue.js.
Dvosmjerno / reaktivno vezivanje podataka
Kako bismo pokazali reaktivno vezivanje podataka, možemo koristiti v-model direktiva na polju obrasca za unos. Interno će emitirati događaj i promijeniti varijablu. Na koje se možemo vezati negdje drugdje u predlošku pomoću dvostrukih kovrčavih zagrada ili sintakse "Brkovi".
Pišete: linuxhintText
Sad, kad god unesemo znak u polje za obrazac za unos, možemo vidjeti da se varijabla također ažurira istovremeno.
Završavati
U ovom smo članku naučili kako vezati varijable u Vueu.js koristeći dvostruke kovrčave zagrade ili sintaksu "Brkovi". Također smo demonstrirali dvosmjerno / reaktivno vezivanje podataka u Vueu.js koristeći v-model direktivu. Nakon čitanja ovog članka, vezivanje podataka više nije težak zadatak za početnike koji su tek započeli s Vueom.js. Dakle, nastavite učiti koncepte Vuea.js s linuxhintom.com. Hvala vam!