IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> SpringMVC+Thymeleaf URL请求Thymeleaf设置请求中的变量 -> 正文阅读

[JavaScript知识库]SpringMVC+Thymeleaf URL请求Thymeleaf设置请求中的变量

web项目中,前端发送URL请求不外乎两种情况:无参数的请求和带参数的请求。

(一):无参数的请求最简单,例如下面的例子跳转到登录页面:

地址栏效果:http://localhost:8080/web_resource/login

前端代码
<span>已有帐号,<a th:href="@{/web_resource/login}">去登录></a></span>

后端Controller@RequestMapping("/web_resource")
@Controller()
public class AccountController {
    @RequestMapping("/login")
    public String toLogin(){
       return  "login";
    }
}

(二):带参数的请求
这种请求很重要,也是写项目必须掌握的。
常用的带参数的请求有3三种,这个3种分别对应2个注解 ,根据使用场景不一样自行选用。
①第一种:@RequestMapping(value = “/stumain”,method =RequestMethod.POST)
或者@PostMapping("/stumain"),接收参数不需要参数

比如登录功能,需要提交表单中登录信息,这个时候使用以上注解,会根据表单中name的值自动封装入参数对象(前提是已经根据数据库编写了实体类)Account account。SpringMVC的参数绑定过程是把表单的请求参数,作为控制器中方法参数进行绑定的。

地址栏效果:http://localhost:8080/web_resource/stumain

前端代码
<form method="post" th:action="@{/web_resource/stumain}" >
    <div>
        <span class="label">用户名</span>
        <input type="text" class="cs" name="account"/>
    </div>
    <div>
        <span class="label2">密码</span>
        <input type="password" class="cs" name="passwork"/>
    </div>
    <div th:text="${msg}" style="color: red;"></div>
    
    <div class="item">
        <input type="submit" class="butt" value=">确认"/>
        <input type="reset" class="butt" value=">重写"/>
    </div>
</form>

后端Controller@RequestMapping("/web_resource")
@Controller()
public class AccountController {
    @RequestMapping(value = "/stumain",method = RequestMethod.POST)
    private ModelAndView stuLogin(Account account){
        
    }
}

②第二种:接收参数需要用@PathVariable
用于绑定url中的占位符。例如:请求url中/myresources/{uploader}},这个{uploader}就是占位符。url支持占位符时spring3.0之后加入的。是springmvc支持rest风格URL的一个重要标志。

地址栏效果:http://localhost:8080/web_resource/myresources/web_1114155730693

前端请求格式
<a href="myres" th:href="@{/web_resource/myresources/{uploader}(uploader=${session.account.getId()})}"/>
${session.account.getId()}这个传入存储在Session中的id

后端Controler@RequestMapping("/web_resource")
@Controller()
public class AccountController {
   @RequestMapping("/myresources/{uploader}")
public String toMyResources(@PathVariable(value = "uploader") String uploader){
    
}
}

③第三种:接收参数需要用@RequestParam
作用:把请求中指定名称的参数给控制器@Controller中的形参复制
属性:
value:请求参数中的名称

地址栏效果:http://localhost:8080/web_resource/myresources?uploader=web_1114155730693

前端请求格式
<a href="myres" th:href="@{/web_resource/myresources(uploader=${session.account.getId()})}"/>

后端Controler@RequestMapping("/web_resource")
@Controller()
public class AccountController {
   @RequestMapping("/myresources")
public String toMyResources(@RequestParam(value = "uploader") String uploader){
    
}
}
  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-11-15 15:45:41  更:2021-11-15 15:48:52 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 3:47:51-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码