Java、 Vue 前后端数据封装传递具体实现方法，如何将JavaScript对象转换为具体的实体类对象 - 若依框架模板、字符串数组[1,2,... ] 的后端转化 String[]

本文链接：https://blog.csdn.net/qq_42701659/article/details/131491363

一、前端

就笔者目前来看，前端无论是使用怎么的方法封装数据的，最好是使用 formData 类型的对象存储数据，而且内部所有的key 键对应的值，最好是字符串类型的，将 JavaScript 对象的数据转变为字符串格式，即 Json 字符串格式，前端方法有 JSON.stringify()，可以将 JavaScript 对象的数据转变为字符串格式， JavaScript 对象一般为花括号。

JavaScript 对象例子：

obj = {
	name: '测试名称',
	sex: '男',
	age: 23
}

1、前端具体实现模板例子如下：

以 Vue 项目为例：

Test.js 文件（api 接口文件）

// 文章新增或修改路由
import request from '@/utils/request'

export function testapi(data) {
  
  
  return request({
    url: '/test/accept_data',
    method: 'post',
    data: data
  })
}

Test.Vue （组件）

Tips：个人建议

有一点要注意如果出现字符串数组或数字数组类型的类型，Java后端可以用 String[] 或 Integer[] 进行转换

<template>
省略内容
...

</template>
<script>
import {testapi } from "@/api/test";  // 导入 api 接口 Test.js

export default {
省略内容
...

  methods: {
  
  testsubmit(){
	let data = {
		name: '测试名称',
		sex: '男',
		age: 23
		choice: [1,2,3,4,5,6]
	}
	let formData = new FormData()
	formData.append('formdata', JSON.stringify([data]))
	// api 接口调用
	testapi(formData).then(response=>{
	console.log("------------ result: ", response)
	})
	}
	}
}
</script>

二、Java 后端

TestEntity.java:


public class TestEntity{

    private String name;
    private String sex;
    private String age;
    private String[] choice;
}

Java：

import com.alibaba.fastjson2.JSON;
import java.util.List;
import com.ruoyi.common.core.domain.AjaxResult;

@RestController
@RequestMapping("/test")
public class TestController
{

 @PostMapping("/accept_data")
 public AjaxResult uploadData(@RequestParam("formdata") String formdata) throws Exception
    {
    	try{
    	    List<TestEntity> to_Obj_1 = JSON.parseArray(formdata, TestEntity.class);
    	    
    	    TestEntity to_Obj_2  = JSON.parseObject(formdata, TestEntity .class);

    	    
    	    AjaxResult ajax = AjaxResult.success();
    	    ajax.put("result", success);
    	    return ajax;
    	}
		catch (Exception e)
        {
            return AjaxResult.error(e.getMessage());
        }
	}
}