Uniapp 的 uni.request传参后端

以下是使用Uniapp的交互数据的两种方式

后端使用@Parameter接收数据

后端使用@RequestBody接收Json格式数据

后端:

复制代码
@CrossOrigin
@RestController
@RequestMapping("/user")
public class UserController {

    @GetMapping("/login")
    public String login(@RequestParam("username") String username,@RequestParam("password") String password){
        System.out.println(username);
        System.out.println(password);

        return "登录成功";
    }

    @PostMapping("/login")
    public String jsonLogin(@RequestBody UserDTO userDTO){
        System.out.println(userDTO.getUsername());
        System.out.println(userDTO.getPassword());


        return "登录成功";
    }
}

前端:

复制代码
import { ref } from 'vue';

let username = ref('')
let password = ref('')

function login() {  
    uni.request({ 
        url: "http://localhost:8080/user/login",   
        data:({   
            username: username.value,
			password: password.value
        }),  
        success: function(res) {  
            console.log(res.data);  
        },  
        fail: function(err) {  
            console.error(err);  
        },
		complete() {

		}
    }); 
	
}


function jsonLogin(){
	uni.request({  
	    url: 'http://localhost:8080/user/login', // 你的后端API地址  
	    method: 'POST',  
	    data: {  
	        username: username.value,  
	        password: password.value  
	    },  

	    success: function (res) {  
	        // 请求成功时的回调函数  
	        console.log(res.data); // 打印后端返回的数据  
	    },  
	    fail: function (error) {  
	        // 请求失败时的回调函数  
	        console.error(error); // 打印错误信息  
	    }  
	});
}
相关推荐
发现你走远了几秒前
前端多环境自动化部署实战:GitHub Actions + Azure Blob + Cloudflare
前端·自动化·github
香香爱编程几秒前
vue3自定义顶部弹窗
前端·javascript·vue.js
.Cnn1 分钟前
MySQL事务和Spring事务
数据库·后端·mysql·spring
绝知此事8 分钟前
Redis 从入门到精通:Spring Boot 实战三部曲(二)—— 进阶原理与高可用架构
spring boot·redis·架构
星晨雪海9 分钟前
基于 SpringBoot + Redis (Lettuce) + RabbitMQ 实现「Redis 预扣库存 + 异步同步数据库」
数据库·spring boot·java-rabbitmq
GISer_Jing10 分钟前
Claude Code 技术深度解析:一个活在终端里的 AI 编程助手
人工智能·elasticsearch·前端框架
weelinking11 分钟前
【产品】10_搭建前端框架——把你的原型变成真实页面
java·大数据·前端·数据库·人工智能·python·前端框架
蜡台12 分钟前
Vue Echart 的 **高阶组件化** 封装思路
前端·javascript·vue.js·echarts
xuankuxiaoyao12 分钟前
vue.js 路由第二篇
前端·javascript·vue.js
一 乐13 分钟前
图书电子商务网站系统|基于SprinBoot+vue图书电子商务网站设计与实现(源码+数据库+文档)
java·前端·数据库·vue.js·论文·毕设·图书电子商务网站系统