Yahoo! User Interface Blog (YUIBlog)

Yui 3 Quick Tip: Pagdaragdag ng iyong Sariling Galing

Lucas ( @ ls_n ) post ang snippet na ito sa tugon sa isang tanong sa iba pang mga araw, at Akala ko ito ay nagkakahalaga ng pagbabahagi dito bilang isang mabilis na tip.

Tulad ng karamihan pili-based na idioms, maraming nagpapahayag Yui 3 kapangyarihan ay mula sa kung ano ang maaari mong gawin sa sandaling mayroon kang reference sa isa o higit pang mga HTMLElements - sa Yui 3, na nangangahulugan na may isang reference node, kung saan Y.one( selector string ) karaniwang makakuha ng sa pamamagitan ng Y Y.one( selector string ) o Y.all( selector string ) . Kaya, Y.one("#foo"). doSomethingInteresting doSomethingInteresting ay isang karaniwang pattern .

Ito ay madali upang palawigin ang expressiveness Yui 3 sa pamamagitan ng pagdaragdag ng iyong sariling magic sa node (at / o NodeList). Narito ang isang paraan upang gumawa ng modular at magagamit muli ang iyong extension.

Una, lumikha ng isang bagong pasadyang module (kami tawag node++ ):

  YUI.add ('node + +', ang function (Y) {
	
	 / / Tukuyin ang isang function na ay tatakbo sa konteksto ng isang
	 / / Node halimbawa:
	 function na doSomethingAwesome () {
		 Y.log ("Huwag ang isang bagay kasindak-sindak dito.");
	 }

	 / / Gamitin addMethod upang magdagdag ng doAwesomeThing sa node tularan:
	 Y.Node.addMethod ("doAwesomeThing", doSomethingAwesome);
	
	 / / Extend ang functionality na ito sa NodeLists:
	 Y.NodeList.importMethod (Y.Node.prototype, "doAwesomeThing");
	
 }, '0 .0.1 ', {Nangangailangan ng: [' node ']}); 

Ang diwa ng Lucas ay dito .

Gamit ang kahulugan na iyon sa node++ node + use ay maaaring gamitin d sa anumang pagkakataon. Sa iyong code ng pagpapatupad, gusto mo gawin:

  Yui (). Paggamit ('node + +', ang function (Y) {
	
	 / / Gamitin mula sa isang solong node:
         . Y.one ('# foo') doAwesomeThing ();

	 / / Gamitin mula sa isang NodeList:
	 . Y.all ('p') doAwesomeThing ();
	
 }); 

Tandaan na lamang ang mga halimbawa ng Yui (s) na kung saan magbigkis mo node++ + + module ay magkakaroon doAwesomeThing access sa doAwesomeThing. Isang tampok ng disenyo na magugustuhan mo binuo mo ang kumplikadong mga apps ay na ang iyong lohika sa pagpapatupad ay hindi kailangan upang baguhin kung ang listahan node++ sa node + + evolves - na ay makakakuha ng hawakan para sa use() sa paggamit () oras , at ang dependency Ang pahayag mananatiling gamit ang code na kung saan ito pertains.

Maghanap ng mga pag- uusap : Bloglines | Technorati

Ibahagi at i- extend: Bookmark sa del.icio.us | Digg ito ! | reddit!