Home-theater-designers
Можете да користите библиотеке компоненти које пружају унапред изграђене, стилизоване елементе да бисте поједноставили процес развоја за Реацт апликације. Ове библиотеке могу уштедети много времена и труда, али такође могу ограничити вашу контролу над стилизовањем ваше апликације. Ако вам је потребна већа контрола над стиловима ваших Реацт апликација, размислите о коришћењу библиотеке компоненти без стила.
Шта су библиотеке нестилизованих компоненти?
Унстилед компонента библиотеке се користе за развој приступачних Реацт апликација . То су колекције компоненти корисничког интерфејса за вишекратну употребу без унапред дефинисаних стилова. Они вам пружају основну структуру елемената корисничког интерфејса без икаквог стила. Ово вам даје потпуну контролу над изгледом и осећајем ваших компоненти.
Предности библиотека компоненти без стила
Ево неких предности коришћења библиотека компоненти без стила:
- Потпуна контрола над стилизовањем : Нестилизоване библиотеке компоненти дају вам потпуну контролу над изгледом ваших компоненти. Можете да користите било који ЦСС или оквир за стилизовање да бисте прилагодили компоненте тако да одговарају вашим потребама.
- Убрзати развој : Библиотеке компоненти које нису стилизоване могу вам помоћи да убрзате развој пружањем скупа унапред изграђених компоненти које можете да користите у својој апликацији.
- Лако се одржава : Нестилизоване библиотеке компоненти се лако одржавају јер нису чврсто повезане са било којим специфичним оквиром за стилизовање. То значи да можете лако ажурирати стил без уношења промена у основни код.
1. Радик УИ
Радик УИ је библиотека компоненти без стила која се фокусира на приступачност. Пружа скуп компоненти корисничког интерфејса дизајнираних да буду доступни свим корисницима. Можете направите прелепе Реацт апликације користећи Радик УИ .
Када радите са Радик УИ, можете инсталирати појединачне компоненте које су вам потребне уместо целе библиотеке. Ово осигурава да ваша апликација буде лагана.
На пример, ако вам је потребна само компонента хармонике, можете је инсталирати у своју апликацију тако што ћете покренути следећу команду:
Ц376ДЕ4ДДД5Е554035341Е37Б90219Б2Ф8612434Након што инсталирате хармонику компоненту, можете да креирате хармонике у вашој Реацт апликацији.
Ево примера како се користи компонента хармонике:
ипхоне ова додатна опрема можда није подржана8246Е2АЦЦБ40АЕ704Ф9319А00Ц0ЕЕ745А2Д21153
Блок кода изнад поставља основну нестилизовану компоненту хармонике користећи @радик-уи/реацт-аццордион библиотека, омогућавајући склопиве ставке са прилагодљивим садржајем.
Код ће генерисати хармонику која изгледа овако:
2. Реагирај Ариа
Реацт Ариа библиотека је скуп кукица за изградњу корисничких интерфејса у Реацт-у. Библиотека олакшава креирање приступачних веб апликација пружањем колекције компоненти које прате најбоље праксе за приступачност.
Адобе је развио и одржава библиотеку Реацт Ариа. Библиотека је део опсежнијег Адобе Спецтрум Десигн система, који пружа свеобухватан скуп смерница и ресурса за дизајн за изградњу приступачних корисничких интерфејса. Елементи које обезбеђује библиотека Реацт Ариа нису стилизовани, што вам омогућава да прилагодите елементе тако да одговарају вашим потребама.
Да бисте користили Реацт Ариа у својој Реацт апликацији, инсталирајте је тако што ћете покренути следећу команду:
ДББ42615722ФЦ688ДБДД99790ФЕ9Д49Е4Ф86ББ89Ево примера како да направите компоненту дугмета користећи усеБуттон кука:
5АЦДДЕАФ20А15Ф541Е5ФЕ7977Б830Е09А8151Д1АСада можете да увезете и рендерујете дугме компоненту у било којој другој компоненти коју одаберете.
На пример:
44ЕД7Е35А1699227А60Е750Е8Б190Ф6ФД4722Е32Када прикажете блок кода изнад, он ће генерисати једноставно дугме које изгледа овако:
Ако вам је непријатно да користите Реацт Ариа због кукица, користите Реацт Ариа компоненте уместо тога библиотека. Ова библиотека обезбеђује унапред изграђене компоненте које су подразумевано доступне. То је танак слој на врху библиотеке Реацт Ариа. Достављене компоненте нису стилизоване, тако да су две библиотеке веома сличне.
3. Основни кориснички интерфејс
Основни кориснички интерфејс је нестилизована Реацт УИ библиотека која обезбеђује компоненте корисничког интерфејса без стилизовања. Тим за Материал УИ креирао је Басе УИ са скупом основних компоненти које можете користити за прављење сопствених прилагођених Реацт апликација. На истом су засновали библиотеку Басе УИ робустан инжењеринг као Материал УИ , али Басе УИ не примењује дизајн материјала.
Можете инсталирати Басе УИ у своју Реацт апликацију помоћу ове команде:
1АД038Б099Е9А8Ф58Ф74Б2ДА7193793Д6884А3ЦДОсновни кориснички интерфејс обезбеђује компоненте у покрету, што значи да можете директно да увозите и користите компоненте из библиотеке. Такође пружа куке које можете користити за креирање и конфигурисање компоненти.
Ево примера коришћења компоненти основног корисничког интерфејса:
Виндовс 10 Мицрософт Сторе не радиЕ01768402Е6Ц84ДЦ5БА89Д9Е81АБ76БД392Ф028Д
Овај код генерише једноставно дугме користећи Дугме компонента библиотеке Басе УИ. Такође можете користити усеБуттон кука за обављање истог задатка.
3046Ц0258Д95ЦФ6БФ41АДД715Д916Б24Д59А4Ф4ДТхе усеБуттон кука и Дугме компонента ће генерисати дугме без стила, као што је приказано на слици испод.
4. Безглави кориснички интерфејс
Још једна библиотека коју можете истражити је Хеадлесс УИ, која нуди нестилизоване елементе корисничког интерфејса, дајући вам слободу да прилагодите изглед и понашање компоненти корисничког интерфејса како вам одговара.
Библиотеку можете инсталирати помоћу следеће команде:
57106Е1Е2АББ670А1241ЦЦАА8Ф8626Д5Е8АЕ402ДНакон инсталирања библиотеке, можете користити неколико компоненти које библиотека пружа у вашој Реацт апликацији.
На пример:
БАЦ8Ц35А08Д6Ф4Ц0АЦЦЦ24Б0Б1ФАЦ1Ц78Б2Б3ЦБ4У овом примеру креирате искачући прозор користећи Скокнем компонента из библиотеке Хеадлесс УИ. Блок кода изнад ће генерисати искачући прозор који изгледа овако.
Добијте потпуну контролу са нестилизованим компонентама
Библиотеке компоненти без стила дају вам потпуну контролу над стилом ваше Реацт апликације, омогућавајући вам да креирате јединствено корисничко искуство. Ове библиотеке нуде низ опција које одговарају вашим потребама. Можете да креирате визуелно привлачне и веома прилагодљиве Реацт апликације коришћењем горе наведених библиотека.