Smíchejte to

ReneRubalcava

<\/HEAD>

<\/P>

Už jste někdy začali pracovat na aplikaci s nějakými vlastními widgety a začali jste si všímat, že váš widget možná začíná být trochu neukázněný<\/STRONG>? Možná se rozrostl z 50 řádků kódu na 100, možná 200, 1000<\/EM>? Nemějte stud, podle vašich potřeb může některý widget vyžadovat hodně věcí, aby práci zvládl, a o to nám přece jde, že? Splnit úkol<\/EM>.<\/P><\/P>Uděláte krok zpět a začnete se dívat, jak byste mohli ten widget rozdělit. Děláte věci jako přidávání grafiky do mapy na základě určitých událostí widgetu? Posloucháte aktivitu mapy, abyste provedli nějakou analýzu pomocí aktuálního rozsahu mapy a jiné služby, která nemusí být v mapě načtena? Možná jen potřebujete posílat aktuální polohu uživatele do FeatureService pokaždé, když je widget aktivován, ale chtěli byste tuto funkčnost přenést do všech widgetů? Neznám váš případ použití, ale pokud se dokážete odprostit a začít rozdělovat svůj widget na menší části, možná můžeme začít věci usnadňovat k lepší správě.<\/P><\/P>Rozdělte chování<\/H2>Dobrým způsobem pohledu na kompozici widgetu je podívat se na chování, které ve svém widgetu potřebujete. Například se podívejme na slavný dijit\/_WidgetBase<\/A>, který jste pravděpodobně použili k vytvoření vlastních widgetů. Když rozšiřujete _WidgetBase<\/STRONG>, dostanete sadu chování, zejména životní cyklus dijitu, což je sada metod, které můžete přepsat pro vytvoření svého widgetu během jeho tvorby. Pro více detailů o vlastních widgetech a životním cyklu dijitu můžete zhlédnout toto video na mém blogu<\/A>. Také získáte další sadu chování, což jsou metody set\/_get<\/STRONG> pro atributy z dojo\/_Stateful<\/A>, které vám umožňují sledovat změny.<\/P>

<\/P>

Pokud chcete, aby tento widget používal šablonový HTML řetězec k definování svého uživatelského rozhraní, můžete rozšířit

dijit\/_TemplatedMixin<\/A>, který přidává jednu jednoduchou vlastnost pro vás, templateString<\/STRONG>. Tato jediná vlastnost vám umožňuje postavit celé UI kolem vašeho widgetu. To je docela silné, když nad tím přemýšlíte.<\/P><\/P>

Buďte ve svém nejlepším chování<\/H2>Jak tedy přesně můžete začít začleňovat mixiny do svých projektů? Předpokládejme, že si všimnete, že ve svých widgetech neustále přidáváte schopnost znovu centrovat mapu, když se něco stane. Jedním ze způsobů, jak toho dosáhnout, je vyčlenit toto chování do mixinu. Nevím jestli je to konvence, ale všiml jsem si v knihovně dijit<\/A>, že mixiny mají předponu podtržítka, tak pojďme vytvořit mixin nazvaný _RecenterMixin<\/STRONG>.<\/P><\/P>Mohl by vypadat nějak takto:<\/P>define([\n  'dojo\/_base\declare'\n], function(declare) {\n  return declare(null, {\n    \/\/- tento mixin funguje za předpokladu\n    \/\/- že máte mapu přiřazenou ke svému widgetu.\n    \/\/- také předpokládá, že mapa byla inicializována s\n    \/\/- centrem a zoomem\n    recenter: function() {\n      var map = this.get('map');\n      var params = map._mapParams;\n      if (params.center) {\n        map.centerAt(params.center);\n      }\n    }\n  });\n});<\/PRE><\/P>Nyní tedy můžete vytvořit widget, který tento mixin rozšiřuje a jednoduše zavolat metodu recenter kdykoli ji potřebujete. Můžu ji použít ve widgetu obalujícím BasemapGallery<\/A> a znovu centrovat mapu při změně základní mapy.<\/P>

define([\n  'dojo\/_base\declare',\n  'dojo\/_base\lang',\n  'dojo\/dom',\n  'dojo\/dom-construct',\n  'esri\/domUtils',\n  'esri\/dijit\/BasemapGallery',\n  'dijit\/_WidgetBase',\n  'dijit\/_TemplatedMixin',\n  '.\/_RecenterMixin',\n  'dojo\/text!.\/_templates/BasemapSwitcher.html'\n], function(\n  declare, lang, dom, domConstruct,\n  esriDomUtils, BasemapGallery,\n  _WidgetBase, _TemplatedMixin,\n  _RecenterMixin,\n  template\n) {\n  return declare([_WidgetBase, _TemplatedMixin, _RecenterMixin], {\n    templateString: template,\n    postCreate: function() {\n      var node = dom.byId('map_root');\n      esriDomUtils.hide(this.domNode);\n      domConstruct.place(this.domNode, node);\n      var map = this.get('map');\n      this.gallery = new BasemapGallery({\n        map: map,\n        showArcGISBasemaps: true\n      }, this.bmNode);\n      this.gallery.startup();\n      this.gallery.on('selection-change', lang.hitch(this, function() {\n        this.recenter(); \/\/ MIXIN MAGIC\n      }));\n    },\n & nbsp ; hide: function() { \ n & nbsp ; & nbsp ; esriDomUtils.hide(this.domNode); \ n & nbsp ; }, \ n & nbsp ; show: function() { \ n & nbsp ; & nbsp ; esriDomUtils.show(this.domNode); \ n & nbsp ; } \ n }); \ n}); < / PRE > < P > < SPAN style = "font-size: 8pt ; color : #505050 ; " > < EM > Když se podíváte na tento příklad , mohl bych dokonce přesunout metody hide / show do mixinu a znovu je použít jinde < / EM > < / SPAN > < / P > < P > < / P > < H2 id = "toc-hId-1015442459" id = "toc-hId-1015442459" > Počkejte chvíli < / H2 > < P > Možná se ptáte sami sebe , < EM > jaký je rozdíl < / EM > mezi něčím jako < STRONG > _WidgetBase < / STRONG > a mixinem ? Typicky je mixin sám o sobě docela neužitečný . V příkladu výše , pokud byste jen rozšířili samotný < STRONG > _RecenterMixin < / STRONG > , neměli byste metodu < STRONG > postCreate < / STRONG > ani < STRONG > templateString < / STRONG > , se kterými byste mohli pracovat . Mixin může dokonce záviset na něčem jako je < STRONG > _WidgetBase < / STRONG > , zapojení do metod životního cyklu . V jádru stále rozšiřujete moduly , rozšiřujete chování nebo widgety . < / P > < P > < / P > < P > Na github jsem pro vás umístil < A href = "https://github.com/odoe/esrijs-mixin-sample" rel = "nofollow noopener noreferrer" target = "_blank" > demo repozitář tohoto projektu </ A > , abyste si mohli hrát . < / P > < P > < / P > < P > Takže běžte ven a zjistěte , jestli můžete začít vyčleňovat mixiny ve svém projektu a možná zjednodušit údržbu své aplikace . Možná zjistíte , že se vám opravdu líbí možnost znovu používat chování mezi různými widgety , < EM > využít více ze všech tvrdých prací , které jste vložili do svého kódu </ EM > . < / P > < P > < / P > < P > Pro více tipů a triků geodev navštivte můj blog na adrese 

můj blog.