Вуе.јс Ватцх Проперти

Вуе.јс је врло моћан и реактиван Јавасцрипт оквир, који се користи за изградњу Уис-а (кориснички интерфејс) и СПА-а (апликације на једној страници). Направљен је комбиновањем најбољих карактеристика из већ постојећих оквира Ангулар и респонсе. Програмери такође воле да кодирају или граде апликације у њему.

Вуе.јс пружа својство сата да посматра и реагује на променљиве или промену података. Својство ватцх можемо користити за манипулисање ДОМ-ом када се променљива за гледање промени. У овом чланку ћемо погледати како можемо да користимо својство сата и извршимо жељене задатке на промени променљиве. Па, кренимо.

Посматрачи

А посматрач у Вуе.јс делује као преслушач догађаја променљиве или својства. Користи се за остваривање неколико задатака на промени неке одређене особине. То вам добро дође док радите асинхроне задатке.

Покажимо и разумемо концепт посматрача разматрајући пример.

Пример:

Претпоставимо да правимо веб локацију за е-трговину, у којој имамо списак предмета, и правимо је колица или компонента за наплату. У тој компоненти морамо израчунати количину појединог елемента у односу на број предмета.

Прво, претпостављамо нека својства података.

подаци ()
ретурн
итемНаме: "Итем 1",
итемКуантити: нулл,
итемПрице: 200,
тоталПрице: 0

,

У којој ћемо гледати својство „итемКуантити“ и израчунати укупну цену. Прво ћемо извршити везивање података у предлошку,

пре писања кода за гледање променљиве и израчунавање укупне цене.

Након писања овог кода, добићемо нашу веб страницу попут ове:

Сада желимо да променимо укупну цену на промени „итемКуантити“ као кад год корисник промени количину помоћу поља за унос. Укупна цена би требало да се промени. У ту сврху морат ћемо пратити „итемКуантити“ и израчунати укупну цијену кад год се промијени својство „итемКуантити“.

Дакле, посматрач „итемКуантити“ би био следећи:

гледати:
итемКуантити ()
ово.тоталПрице = ово.итемКуантити * ово.Цена одвојено;
конзола.лог (тхис.итемКуантити);

Сада, кад год корисник промени „итемКуантити“, укупна цена ће се променити за тренутак. Не морамо више ни о чему да бринемо. За овај прорачун сада ће се побринути власништво сата.

Погледајмо веб страницу:

Покушајмо да повећамо или променимо количину и видимо неке резултате:

Ако променимо количину, рецимо „4“, укупна цена би била „800“:

Слично томе, ако количину променимо у „7“, укупна цена би била „1400“:

Дакле, овако функционише својство сата и помаже у реактивном развоју. Реактивност је нека врста Вуеовог потписа.јс. Такође, својство сата добро долази током извођења асинхроних операција.

Закључак

У овом чланку смо сазнали шта је својство сата и како га можемо користити у Вуе-у.јс. Такође смо испробали пример из стварног живота да бисмо разумели његову стварну примену. Ово много помаже у уштеди времена и убрзавању процеса развоја. Надамо се да вам је овај чланак био користан и да настављате да посећујете линукхинт.цом за боље разумевање.