След като започнете да създавате приложения, които започват да съставят множество джаджи и се опитвате да управлявате състоянието на тези джаджи, може да искате да започнете да разглеждате Dojo Containers. Контейнерите ви позволяват да инжектирате стойности в свойствата на уиджета, без да се налага да импортирате състояние директно във вашия уиджет.

За да направи това, Dojo предоставя компонент от по-висок ред, подобен на този, който може да използвате с React. Този HOC се намира в @dojo/framework/widget-core/Container.

Да приемем, че искате да работите с API за стрийминг и да актуализирате своята джаджа, когато потокът върне нови данни. Искаме да покажем тези данни в прост списък.

Тази джаджа има items масив в свойствата. Можете да обвържете тази джаджа директно с хранилище на данни и да актуализирате джаджата, когато постъпят нови данни, но отново, може би искаме тези данни да са налични в родителската джаджа или в други използвани джаджи.

Нека създадем родителски контейнер за приложение, който ще изобрази тази джаджа.

Този конкретен контейнер не прави нищо друго, освен да предава свойствата си на дъщерния елемент Items.

За да използваме Dojo Container, трябва да създадем getProperties функция, която дефинира свойствата, върнати на Container.

Сега можем да увием нашето AppContainer в контейнера на Dojo.

В този случай "state" е името, което предоставям за моя контекст, който наричам моя инжектор, тъй като ми позволява да инжектирам стойности в моите джаджи.

В този момент имате опция как да управлявате състоянието си. Можете да използвате Dojo stores или можете да създадете клас, който приема invalidator и можете да използвате този invalidator, за да уведомите компонента от по-висок ред, че състоянието се е променило и той ще го предаде на джаджата, която е обвил.

Засега нека използваме клас, който приема инвалидизатор и го нарича контекст за нашия контейнер. Можем да разгледаме магазините на Dojo в друга публикация.

Именно в този Context се абонирам за моя поток от данни и актуализирам масива items, когато се предават нови данни.

Добре, нека свържем всичко заедно в нашето main.ts, което стартира цялото приложение.

Когато регистърът се предаде на проектора, той ще се увери, че всичко е свързано според нуждите.

Това може да изглежда като няколко стъпки, но прави управлението на състоянието много гъвкаво във вашите джаджи, без да се налага да обвързвате джаджи към източник на данни, което ги прави невероятно повторно използвани.

Можете да създадете контейнери за всяка отделна джаджа във вашето приложение и да управлявате тяхното състояние независимо, това би било много мощно!

Можете да видите образец на това приложение по-горе тук:

Не забравяйте да се абонирате за бюлетина и да сте в течение с най-новото съдържание!

Първоначално публикувано в learn-dojo.com на 15 октомври 2018 г.