th:inline 有三个取值类型 (text, javascript 和 none),值为 none 什么都不做,没有效果
内敛文本(th:inline=”text”)内敛文本表达式不依赖于 html 标签,直接使用内敛表达式[[表达式]]即可获取动态数据,但必须要求在父级标签上加 th:inline = “text”属性
内敛脚本(th:inline=”javascript”)th:inline=”javascript”在 js 代码中获取后台的动态数据
内敛文本和内敛脚本写在一起,对比学习
写一个controller类
package com.liuhaiyang.springboot.controller; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.RequestMapping; @Controller public class UserController1 { @RequestMapping("inline") public String Inline(Model model){ model.addAttribute("data","springboot inline"); return "inline-test"; } }
写一个前端html页面 inline-test展示数据
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>内敛表达式</title> </head> <body> <div th:text="${data}"></div><br> <h1>内敛文本:th:inline="text"</h1> <div th:inline="text"> 数据:[[${data}]] </div> <br> <h1>内敛脚本 th:inline="javascript" 帮助显示接收的数据</h1> <script type="text/javascript" th:inline="javascript"> function showData(){ alert([[${data}]]); alert("---------");<!--有无内敛脚本都可以显示--> } </script> <input type="button" value="显示数据" th:onclick="showData()"> </body> </html>
核心配置文件
spring.thymeleaf.cache=false
启动入口类测试