Читаоци попут вас помажу у подршци МУО. Када обавите куповину користећи везе на нашем сајту, можда ћемо зарадити провизију за партнере. Опширније.
Нект.јс је моћан оквир за изградњу Реацт апликација високих перформанси. Једна од његових карактеристика је могућност креирања прилагођених изгледа за ваше странице што вам омогућава да креирате конзистентан дизајн који је лако одржавати и ажурирати у вашој апликацији.
Креирање компоненте прилагођеног распореда у Нект. ЈС
У фасцикли под називом компоненте у вашем Нект.јс пројекту, креирајте Лаиоут.јск и додајте следећи код да бисте креирали компоненту изгледа.
увоз Глава из'следећи/глава'
увоз Хеадер из'./Хеадер.јск'
увоз Подножје из'./Фоотер.јск'
конст Лаиоут = (деца) => (
Моја апликација</титле>спан> "стилесхеет"спан> хреф="/статиц/цсс/стиле.цсс"спан> /> </Хеад>спан> {цхилдрен} </див>спан>)извозспан> подразумеваноспан> Изгледцоде> пре>< п>Ова компонента увози компоненте заглавља и подножја и прихвата децу као реквизитиспан>. Он приказује децустронг> између компоненти заглавља и подножја. Када премотате страницу са овим распоредом, заглавље и подножје ће бити приказани на врху и на дну.п> Коришћењем алатке Компонента распореда х2>Да бисте користили компоненту изгледа, увезите је у компоненту странице и користите је као што је приказано у наставку.п> импортспан> Изглед одспан> '../цомпонентс/Лаиоут'спан>цонстспан> Страница = ()спан> =>спан> ( Почетна</х1>спан> </Лаиоут>спан>)извозспан> подразумеванаспан> страницацоде> пре>Примениће се изглед ове странице. Овај процес можете поновити на свим страницама на којима желите да примените изглед.п>Да бисте истовремено користили изглед на свим страницама у апликацијама, увезите их увезите. компоненту изгледа у датотеку /паге/_апп.јсстронг> и користите је на следећи начин.п> импортспан> Лаиоут фромспан>. спан> "../цомпонентс/лаиоут"спан>;функцијаспан> Моја апликацијаспан>({ Цомпонент, пагеПропс } спан>) спан>{ повратакспан> ( </Лаиоут> спан> ) ;}цоде> пре>До сада приказани примери користите фасцикле Нект.јс 12 страница. У Нект.јс 13, ви креирате изглед у директоријуму апликације (од тренутка писања, он је у бета верзији).п> Креирање прилагођеног распореда у фасцикли апликација х2>фасцикла апликација у Нект.јс 13 спан>захтева да направите основни изглед у његовој основи. Ово је изглед који ће Нект.јс применити на све странице ваше апликације.п>Да бисте демонстрирали, направите датотеку под називом лаиоут.јскстронг> и додајте следећи код.стронг> п> извозспан> подразумеванаспан> функцијаспан> РоотЛаиоутспан>({ деце } спан>) спан>{ повратакспан> ( "ср"спан>> {цхилдрен</боди>спан> </хтмл>спан>< бр/> );}цоде> пре>Основна компонента распореда прихвата и приказује децастронг>. Испод су неке од ствари које треба да знате о основном распореду:п> Морате га укључити у фасциклу апликације. ли> Замењује _апп.јсстронг> и _доцумент.јсстронг> у фасцикли страница Нект.јс 12. ли> Морате експлицитно да укључите ХТМЛ и боди ознаку. ли> То је подразумевано серверска компонента. ли> ул>Као што је поменуто, основни изглед се примењује на све странице, па како да креирате прилагођене изгледе за различите сегменте руте?п>У фасцикли апликације можете да дефинишете руту тако што ћете креирати фасцикле за сваку руту сегмент. На пример, прављење директоријума под називом чланцистронг> мапира се на УРЛ путању апп/артицлесстронг>. Да бисте додали даље сегменте руте, креирајте поддиректоријум унутар главне фасцикле руте. На пример, додавање директоријума под називом У трендустронг> унутар мапе чланцистронг> мапира УРЛ путању апп/артицлес/трендингстронг>.п>Када додате компоненту лаиоут.јскстронг> у фасциклу руте, она ће се применити на све странице унутар тог сегмент руте и његове подфолдере. На пример, додавање компоненте изгледа у фасциклу чланцистронг> ће се применити на све странице на путањи чланака, укључујући и оне у поддиректоријуму У трендустронг>. Ако додате и компоненту изгледа у директоријум трендовистронг>, распоред у директоријуму чланци ће бити угнежђен у њему.п> Предности коришћења распореда х2>Нект.јс вам омогућава да креирате компоненте изгледа које можете поново да користите у различитим странице. Ово вам омогућава да имате доследан изглед на вашој веб локацији без дуплирања кода на више страница. Поред тога, изгледи вам помажу да брзо примените промене јер не морате да мењате сваку страницу.п>див>див>флоки>