最近、Thymeleafテンプレートにパラメーターを渡すSpring Bootの例をデバッグしていましたが、多くの落とし穴を踏んでいました。参照用の詳細なプロセスを次に示します。
まず、ModelAndViewDemoという名前のMavenプロジェクトを作成します。次の表に、重要なファイルの説明を示します。
| 重要なドキュメント |
説明 |
| pom.xml |
プロジェクトで使用される依存関係パッケージ、特にThymeleaf依存関係パッケージが導入されました |
| SpringBootApp.java |
クラスを開始 |
| Controller.java |
ModelAndViewオブジェクトとフロントエンドThymeleafの相互作用を介したコントローラークラス |
| Application.properties |
Thymeleafの関連する構成を含む構成ファイル |
| hello.html |
Thymeleafテンプレートを含むフロントエンドページファイル。これはresourcesディレクトリのtemplatesディレクトリにあることに注意してください。このディレクトリ構造は、構成ファイルの構成と一致している必要があります。 |
最初のステップは、このプロジェクトの依存関係パッケージをpom.xmlに含めることです。キーコードは次のとおりです。その中で、thymeleafテンプレートの依存関係パッケージは、6行目から9行目までのコードを通じて導入されています。
1 <dependencies>
2 <dependency>
3 <groupId>org.springframework.boot</groupId>
4 <artifactId>spring-boot-starter-web</artifactId>
5 </dependency>
6 <dependency>
7 <groupId>org.springframework.boot</groupId>
8 <artifactId>spring-boot-starter-thymeleaf</artifactId>
9 </dependency>
10 </dependencies>
2番目のステップは、スタートアップクラスを作成することです。
1 package prj;
2 import org.springframework.boot.SpringApplication;
3 import org.springframework.boot.autoconfigure.SpringBootApplication;
4 @SpringBootApplication
5 public class SpringBootApp {
6 public static void main(String[] args) {
7 SpringApplication.run(SpringBootApp.class, args);
8 }
9 }
3番目のステップは、コントローラークラスを作成することです。コードを以下に示します。
1 package prj.controller;
2 import org.springframework.web.bind.annotation.RequestMapping;
3 import org.springframework.web.bind.annotation.RestController;
4 import org.springframework.web.servlet.ModelAndView;
5 @RestController
6 public class Controller {
7 @RequestMapping("/welcome")
8 public ModelAndView welcome() {
9 ModelAndView modelAndView = new ModelAndView("hello");
10 modelAndView.getModel().put("name", "Tom");
11 return modelAndView;
12 }
13 }8行目のwelcomeメソッドでは、ModelAndView型のオブジェクトが最初に9行目に作成され、オブジェクト内のビューがコンストラクターによって「hello」として指定され、10行目のコードがモデルのモデルで使用されます。オブジェクトここでは、キーと値のペアの形式で、キーが名前で値がトムのデータが追加されます。まとめると、welcomeメソッドはキーと値のペアのデータをhelloビューに返します。
4番目のステップは、thymeleafテンプレートの関連パラメーターをapplication.propertiesに書き込むことです。具体的なコードは次のとおりです。
1 #启用thymeleaf视图
2 spring.thymeleaf.enabled=true
3 #设置Content-Type值
4 spring.thymeleaf.content-type=text/html
5 ## 检查模板是否存在，然后再呈现
6 spring.thymeleaf.check-template-location=true
7 # 不启用缓存
8 spring.thymeleaf.cache=false
9 # 构建前缀
10 spring.thymeleaf.prefix=classpath:/templates/
11 # 构建后缀
12 spring.thymeleaf.suffix=.html対応するパラメータ項目の前に注記があり、自分で読むことができますが、ここに次の2つの重要な注意点があります。
- thymeleafビューを使用するには、2行目に示されているパラメーターを構成する必要があります。
- 10行目と12行目で定義されている接頭辞と接尾辞は、ModelAndViewオブジェクトのビューと組み合わせて使用されます。たとえば、Controller.javaでは、ModelAndViewで返されるビューはhelloであるため、プレフィックスとサフィックスがそれに応じて追加されます。プラス記号の後の値はclasspath：/templates/hello.htmlで、ビューの場所を指定できます。最後のジャンプが行われるファイル。
5番目のステップでは、thymeleafテンプレートを含むhello.htmlページを作成する必要があります。コードを以下に示します。
1 <!DOCTYPE html>
2 <html lang="en" xmlns:th="http://www.thymeleaf.org">
3 <head>
4 <meta charset="UTF-8">
5 <title>welcome</title>
6 </head>
7 <body>
8 Welcome:<span th:text="${name}"></span>
9 </body>
10 </html>その中で、2行目では、8行目で使用するthタグの名前空間が指定されています。これは、thymeleafテンプレートからのものです。
8行目では、th：text = "$ {name}"の形式で、$ {name}パラメーターを格納するためのプレースホルダーが指定されており、特定のnameパラメーター値がバックエンドから返されます。このページから、thymeleafテンプレートの次のスタイル機能を確認できます。
- この例では、thymeleafテンプレートがHTML5コードに埋め込まれています。これを使用する場合は、2行目に示すようにテンプレート属性要素の名前空間を導入する必要があります。
- html5などのフロントエンドページでは、thymeleaf構文を使用して、8行目のようにパラメーターのプレースホルダーを設定できます。これにより、バックエンドがModelAndViewやその他のフォームを介してパラメーターを渡すときに、プレースホルダーがある場所に配置できます。動的表示。
開発が完了したら、プロジェクトを開始し、コントローラーのwelcomeメソッドの前の@RequestMappingアノテーションに示されているように、ブラウザーにhttp：// localhost：8080 / welcomeと入力すると、出力「Welcome：Tom」が表示されます。 。また、リクエストの開始からデータの表示までの主なプロセスは次のとおりです。
- @RequestMappingアノテーションの定義によれば、http：// localhost：8080 / welcomeリクエストはwelcomeメソッドによって処理されます。
- 戻りビューはwelcomeメソッドでhelloに設定され、nameパラメーターの値はTomに設定されます。
- application.propertiesの構成に従って、返されるビューページは、構成されたプレフィックスとサフィックスに従って決定されます。これは、リソースの下のテンプレートディレクトリにあるhello.htmlです（ディレクトリはこのプロジェクトのクラスパスにあるため） ）。
- 最終的に、thymeleafテンプレートで定義されているようにhello.htmlが表示され、nameパラメーターのプレースホルダーが配置されている場所に「Tom」という単語が表示されます。これは、誰もが最終的に見た結果を示しています。