springboot学習3 - thymeleaf

局bのspringcloudから学び、今でエラーが発生しやすい場所のいくつかを思い出した、ビデオに登場する小さな誤差の要約除去を要約
アウトバウンドリンクB:https://www.bilibili.com/video/av55993157
データ・リンク:
https://pan.baidu.com/s/1o0Aju3IydKA15Vo1pP4z5w
抽出コード:21ru

リンク上の
セクションのリンクを次の:

次のリストまとめたものです。
最初の講義エンジニアリングSpringboot、プロファイルを追加Application.ymlコントローラ/ IndexHandler.java→新しいリソース/テンプレート/ index.htmlを→検出符号とPOM→親を変更します

変更コントローラ/ IndexHandler.java→変更コード資源/テンプレート/ index.htmlを+→検出組み込ま

実装の詳細:
1.プロジェクトspringboot(講義が作成したリンクを
親ポンポンファイル2.追加コード:

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

完全な親ポンポンファイルコード:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.southwind</groupId>
    <artifactId>springboot</artifactId>
    <version>1.0-SNAPSHOT</version>

    <!-- 继承父包 -->
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.0.7.RELEASE</version>
    </parent>

    <dependencies>
        <!-- web启动jar -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <version>1.18.8</version>
            <scope>provided</scope>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
    </dependencies>
</project>

完全なコードですapplication.yml 3.コードを追加し、:

server:
  port: 9090
spring:
  thymeleaf:
    prefix: classpath:/templates/  #前缀
    suffix: .html                  #后缀
    mode: HTML5                    #模型
    encoding: UTF-8                #编码

コントローラ4.新IndexHandler.java、コードを記入:

package com.southwind.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
@RequestMapping("/index")
public class IndexHandler {

    @GetMapping("/index")
    public String index(){
        System.out.println("index...");
        return "index";
    }
}

テンプレートフォルダのリソース5.レコードファイルは

application.yml .htmlの接尾辞であるため、
インデックス内ので、新しいテンプレート

のindex.html 6. <身体>は</ body>のコードを追加します。<H1>のHello World < / H1>
の完全なコード:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>hello world</h1>
</body>
</html>

7.アプリケーションは、クラスを起動再起動
HTTPに:// localhostを:9090 /インデックス/インデックス

8のコード・コントローラ/ IndexHandlerの指標変更部。

    public String index(Model model){
        System.out.println("index...");
        List<Student> list = new ArrayList<>();
        list.add(new Student(1l,"张三",12));
        list.add(new Student(2l,"李四",22));
        list.add(new Student(3l,"王五",14));
        model.addAttribute("list",list);
        return "index";
    }

完全なコード:

package com.southwind.controller;

import com.southwind.entity.Student;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

import java.util.ArrayList;
import java.util.List;

@Controller
@RequestMapping("/index")
public class IndexHandler {

    @GetMapping("/index")
    public String index(Model model){
        System.out.println("index...");
        List<Student> list = new ArrayList<>();
        list.add(new Student(1l,"张三",12));
        list.add(new Student(2l,"李四",22));
        list.add(new Student(3l,"王五",14));
        model.addAttribute("list",list);
        return "index";
    }
}

</ H1>コードのリソース/テンプレート/ index.htmlをした後、9プラス:

    <table>
        <tr>
            <th>学生ID</th>
            <th>学生姓名</th>
            <th>学生年龄</th>
        </tr>
        <tr th:each="student:${list}"><!-- 对应第二行html -->
            <td th:text="${student.id}"></td>
            <td th:text="${student.name}"></td>
            <td th:text="${student.age}"></td>
        </tr>
    </table>

2行目のインデックスを導入します。

<html xmlns:th="http:www.thymeleaf.org"></html>

完了:

<!DOCTYPE html>
<html xmlns:th="http:www.thymeleaf.org"></html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>hello world</h1>
    <table>
        <tr>
            <th>学生ID</th>
            <th>学生姓名</th>
            <th>学生年龄</th>
        </tr>
        <tr th:each="student:${list}"><!-- 对应第二行html -->
            <td th:text="${student.id}"></td>
            <td th:text="${student.name}"></td>
            <td th:text="${student.age}"></td>
        </tr>
    </table>

</body>
</html>

10アプリケーションの再起動は
を入力します。http:// localhostを:9090 /インデックス /インデックス

あなたは、クライアントが直接HTMLリソースにアクセスすることができますしたい場合は、リソースがハンドラの背景静的マッピングを通じてリソースにアクセスするにresour /スタティックルートの下に置かれ、あるいは持っています

公開された42元の記事 ウォンの賞賛2 ビュー1170

おすすめ

転載: blog.csdn.net/qq_40893824/article/details/104692505