Bevezetés a Thymeleaf tavaszi használatába

1. Bemutatkozás

A Thymeleaf egy Java sablonmotor HTML, XML, JavaScript, CSS és szöveg feldolgozásához és létrehozásához.

Ebben a cikkben megvitatjuk hogyan kell használni a Thymeleaf-et tavasszal néhány alapvető használati esettel együtt a Spring MVC alkalmazás nézőrétegében.

A könyvtár rendkívül kibővíthető, és természetes sablonképessége biztosítja a sablonok prototípusának elkészítését háttér-háttér nélkül - ami a fejlesztést nagyon népszerűvé teszi más népszerű sablonmotorokkal, például a JSP-vel összehasonlítva.

2. A tűlevelűek integrálása a tavasszal

Először nézzük meg a Springhez való integrációhoz szükséges konfigurációkat. A tűlevelű-tavaszi könyvtárra van szükség az integrációhoz.

Adja hozzá a következő függőségeket a Maven POM fájljához:

 org.thymeleaf thymeleaf 3.0.11.KÖZLEMÉNY org. thymeleaf thymeleaf-spring5 3.0.11. 

Vegye figyelembe, hogy egy 4. tavaszi projekt esetében a tűlevelű-tavasz4 könyvtár helyett kell használni kakukkfű-tavasz5.

A SpringTemplateEngine osztály elvégzi az összes konfigurációs lépést. Ezt az osztályt babként konfigurálhatja a Java konfigurációs fájlban:

@Bean @Description ("Thymeleaf Template Resolver") public ServletContextTemplateResolver templateResolver () {ServletContextTemplateResolver templateResolver = new ServletContextTemplateResolver (); templateResolver.setPrefix ("/ WEB-INF / nézetek /"); templateResolver.setSuffix (". html"); templateResolver.setTemplateMode ("HTML5"); return templateResolver; } @Bean @Description ("Thymeleaf Template Engine") nyilvános SpringTemplateEngine templateEngine () {SpringTemplateEngine templateEngine = új SpringTemplateEngine (); templateEngine.setTemplateResolver (templateResolver ()); templateEngine.setTemplateEngineMessageSource (messageSource ()); return templateEngine; }

A templateResolver bab tulajdonságai előtag és utótag jelezze a nézetoldalak helyét a webapp könyvtár és fájlnévkiterjesztésük.

A ViewResolver felület tavasszal Az MVC feltérképezi a vezérlő által visszaadott nézetneveket a tényleges nézetobjektumokhoz. ThymeleafViewResolver végrehajtja a ViewResolver felületen, és annak meghatározására szolgál, hogy mely Thymeleaf nézeteket kell megjeleníteni, adott nézetnévvel.

Az integráció utolsó lépése a ThymeleafViewResolver babként:

@Bean @Description ("Thymeleaf View Resolver") nyilvános ThymeleafViewResolver viewResolver () {ThymeleafViewResolver viewResolver = új ThymeleafViewResolver (); viewResolver.setTemplateEngine (templateEngine ()); viewResolver.setOrder (1); visszatérő viewResolver; }

3. Thymeleaf a tavaszi csizmában

Tavaszi csizma automatikus konfigurációt biztosít a Thymeleaf hozzáadásával a tavaszi-bakancs-indító-timeleaf függőség:

 org.springframework.boot spring-boot-starter-thymeleaf 2.3.3. KÖZLEMÉNY 

Nincs szükség kifejezett konfigurációra. Alapértelmezés szerint a HTML fájlokat a források / sablonok elhelyezkedés.

4. Értékek megjelenítése üzenetforrásból (tulajdonságfájlok)

A th: text = "# {kulcs}" tag attribútum használható tulajdonságfájlok értékeinek megjelenítésére. Ahhoz, hogy ez működjön, a tulajdonságfájlt úgy kell konfigurálni messageSource bab:

@Bean @Description ("Spring Message Resolver") nyilvános ResourceBundleMessageSource messageSource () {ResourceBundleMessageSource messageSource = új ResourceBundleMessageSource (); messageSource.setBasename ("üzenetek"); return messageSource; }

Itt található a Thymeleaf HTML kód, amely megjeleníti a kulccsal társított értéket üdvözlő üzenet:

5. A modellattribútumok megjelenítése

5.1. Egyszerű attribútumok

A th: text = ”$ {attributename}” tag attribútum használható a modellattribútumok értékének megjelenítésére. Adjunk hozzá egy modell attribútumot a névvel serverTime a vezérlő osztályban:

model.addAttribute ("serverTime", dateFormat.format (new Date ()));

Az HTML értékét megjelenítő HTML kód serverTime tulajdonság:

A jelenlegi idő: 

5.2. Gyűjtemény attribútumai

Ha a modell attribútum objektumok gyűjteménye, akkor a th: mindegyik tag attribútummal lehet iterálni rajta. Határozzuk meg a Diák modell osztály két mezővel, id, és név:

nyilvános osztály Hallgató megvalósítja a Serializálható {privát egész szám azonosítót; privát karakterlánc neve; // szabványos mérőeszközök és beállítók}

Most hozzáadjuk a hallgatók listáját mint modellattribútum a vezérlő osztályban:

Hallgatók listája = new ArrayList (); // logika a tanulói adatmodell felépítéséhez.addAttribute ("hallgatók", hallgatók);

Végül használhatjuk a Thymeleaf sablonkódot a hallgatók listáján való ismétléshez és az összes mezőérték megjelenítéséhez:

6. Feltételes értékelés

6.1. ha és hacsak

A th: if = ”$ {condition}” attribútum a nézet egy részének megjelenítésére szolgál, ha a feltétel teljesül. A th: hacsak = ”$ {condition}” attribútum a nézet egy részének megjelenítésére szolgál, ha a feltétel nem teljesül.

Adja hozzá a nem mezőt a Diák modell:

nyilvános osztály Hallgató megvalósítja a Serializálható {privát egész szám azonosítót; privát karakterlánc neve; privát Karakter neme; // szabványos mérőeszközök és beállítók}

Tegyük fel, hogy ennek a mezőnek két lehetséges értéke van (M vagy F) a hallgató nemének jelzésére. Ha a „Férfi” vagy a „Nő” szavakat szeretnénk megjeleníteni az egyetlen karakter helyett, akkor ezt a következő Thymeleaf kód használatával valósíthatjuk meg:

6.2. kapcsoló és ügy

A th: kapcsoló és th: eset az attribútumokat a tartalom feltételes megjelenítésére használják a switch utasításstruktúra használatával.

Az előző kód átírható a th: kapcsoló és th: eset attribútumok:

7. A felhasználói adatok kezelése

Az űrlapbevitel a th: action = ”@ {url}” és th: objektum = ”$ {object}” attribútumokat. A th: cselekvés az űrlap művelet URL és. megadására szolgál th: objektum egy olyan objektum megadására szolgál, amelyhez a beküldött űrlapadatok kötve lesznek. Az egyes mezőket a th: mező = ”* {név}” attribútum, ahol a név az objektum megfelelő tulajdonság.

A Diák osztályban létrehozhatunk egy beviteli űrlapot:

A fenti kódban / saveStudent az űrlap művelet URL és a diák a benyújtott űrlapadatokat tároló objektum.

A StudentController osztály kezeli az űrlap benyújtását:

@Controller public class StudentController {@RequestMapping (value = "/ saveStudent", method = RequestMethod.POST) public String saveStudent (@ModelAttribute Student student, BindingResult hibák, Model model) {// logika a bemeneti adatok feldolgozásához}}

A fenti kódban a @RequestMapping annotáció leképezi a vezérlő metódust az űrlapon megadott URL-lel. Az annotált módszer saveStudent () elvégzi a benyújtott nyomtatványhoz szükséges feldolgozást. A @ModelAttribute annotáció az űrlapmezőket a diák tárgy.

8. Validációs hibák megjelenítése

A # fields.hasErrors () függvény segítségével ellenőrizhető, hogy egy mezőben vannak-e érvényesítési hibák. A # fields.errors () függvény használható egy adott mező hibáinak megjelenítésére. A mező neve mindkét funkció bemeneti paramétere.

HTML-kód az űrlap egyes mezőinek hibáinak ismétléséhez és megjelenítéséhez:

A mezőnév helyett a fenti függvények elfogadják a wild card karaktert * vagy az állandó minden az összes mező megjelölésére. A th: mindegyik attribútumot használjuk az egyes mezőknél előforduló többszörös hibák ismétlésére.

Az előző HTML-kódot helyettesítő karakterrel írták újra *:

vagy az állandó használatával minden:

Hasonlóképpen, a tavaszi globális hibák is megjeleníthetők a globális állandó.

A globális hibák megjelenítésére szolgáló HTML-kód:

A th: hibák attribútum a hibaüzenetek megjelenítésére is használható. Az előző kód, amely az űrlap hibáit jeleníti meg, a következővel írható újra th: hibák tulajdonság:

9. Konverziók használata

A dupla zárójeles szintaxis {{}} adatok formázására szolgál a megjelenítéshez. Ez kihasználja a formázók konfigurálva az adott típusú mezőhöz a conversionService a kontextusfájl babja.

A név mező a Diák osztály formázva:

A fenti kód a NameFormatter osztály, a. felülbírálásával konfigurálható addFormatters () módszer a WebMvcConfigurer felület. Erre a célra a mi @ Konfiguráció osztály felülírja a WebMvcConfigurerAdapter osztály:

@Configuration public class A WebMVCConfig kiterjeszti a WebMvcConfigurerAdapter {// ... @Orride @Description ("Custom Conversion Service") public void addFormatters (FormatterRegistry registry) {register.addFormatter (new NameFormatter ()); }}

A NameFormatter osztály hajtja végre a Tavaszt Formázó felület.

A #konverziók segédprogram az objektumok megjelenítésre való konvertálására is használható. A segédfunkció szintaxisa: # conversions.convert (objektum, osztály) hol Tárgy konvertálódik Osztály típus.

Megjeleníteni diák tárgy százalék mező a törtrész eltávolításával:

10. Következtetés

Ebben az oktatóanyagban láthattuk, hogyan kell integrálni és használni a Thymeleaf-et egy Spring MVC alkalmazásban.

Láttunk példákat a mezők megjelenítésére, a bevitel elfogadására, az ellenőrzési hibák megjelenítésére és az adatok megjelenítésre történő konvertálására is. Az ebben a cikkben bemutatott kód működő verziója elérhető a GitHub tárházban.