Използване на JavaScript компоненти в Wicket
13 май 2012 г.
Нека си представим ситуация: трябва да напишете уеб приложение за много взискателен клиент.
В този случай, надявам се, изписването на името на клиента с главна буква Z трябва да ви даде представа за истинското значение на този човек!
Взискателността на клиента се изразява в повишените изисквания, които той поставя както към функционалността, така и към интерфейса на бъдещото приложение. Интерфейсът трябва да е стилен, модерен и модерен. Функционалността на приложението трябва да бъде възможно най-очевидна и опростена. В идеалния случай цялата функционалност на приложението трябва да бъде намалена до един голям красив бутон, като кликне върху който Клиентът ще получи резултата, от който се нуждае тук и сега. И, разбира се, без страници за влизане! Те само претрупват приложението и заплашват сигурността на системата!:) Обаче повече за това някой друг път ...
По време на инициализацията обект за персонализация се предава на конструктора на компонента, който трябва да съдържа следните ключови параметри:
- elementId - идентификаторът на елемента за маркиране на HTML страницата, който ще служи като контейнер за компонента,
- надпис - надписът върху бутона,
- width - ширина,
- височина - височина,
- textColor - цветът на етикета,
- backColor - цветът на самия бутон.
Всички параметри с изключение на първия също са свойства на компонента на бутона и могат да бъдат достъпни с помощта на подходящите гетери/сетери. Стилът на извикване на getters/setters е както следва:
- свойство () или извикване на функция без параметри - гетер за съответното свойство на свойството,
- свойство (стойност) или извикване на функция с един параметър (посочващ стойността, която трябва да бъде зададена) - сетер за съответното свойство на свойството.
Освен това компонентът съдържа функции за задаване на манипулатори за неговите събития:
- addOnMouseOverHandler (func) за задаване на манипулатор за събитие с бутон на мишката,
- addOnMouseOutHandler (func), за да зададете манипулатор за събитието на мишката,
- addOnClickHandler (func), за да зададете манипулатора на събитията за щракване върху бутона.
Инициализация на компоненти с Wicket
Опитът показва, че ключът към разработването на Wicket приложение е да се създаде набор от качествени компоненти, с които потребителите да взаимодействат. Ако сте създали логически, капсулирани приспособления за „висока кохезия“, „ниско свързване“, които работят в рамките на бизнес логиката на вашето приложение, можете да приемете, че повече от половината от работата вече е свършена.
Нека започнем да създаваме компонент, като разширим някакъв стандартен тип компонент Wicket. Тъй като основният клас Component по своята същност е твърде ниско ниво за нашите цели, няма да го използваме. Ако логиката на нашия компонент му позволяваше да има деца, бихме могли да изберем класа WebMarkupContainer. Но в нашия случай това не е така, така че нека се съсредоточим върху класа WebComponent:
Първо, в конструктора на компоненти, използвайки setOutputMarkupId (вярно), ние посочваме, че в крайното маркиране за маркера на компонента трябва да бъде посочен уникален атрибут id, генериран от Wicket.
Второ, ние заместваме метода onComponentTagBody и напълно изчистваме съдържанието на маркера на компонента в него. Това се прави, за да се предпази от грешки, свързани с наличието на някакъв вид боклук вътре в маркера, както и за да можете да използвате малко маркиране вътре в маркера, в случай че искате да визуализирате шаблони на Wicket.
На трето място, ние заместваме метода onComponentTag и променяме името на маркера на компонента, за да се разделя в него, тъй като това е етикетът, с който компонентът на бутона може да работи.
Би било възможно, разбира се, да се провери верността на името на маркера и в случай на неправилен етикет ефективно да се изплюе изключение по време на изпълнение, но като цяло изборът на една или друга опция зависи от вашата вредност.