这个问题困扰了我一天的时间。
首先简单说明以下,我前端请求一开始用的POST,请求代码片段如下:
export const postRequest = (url, params) => {
let accessToken = getStore("accessToken");
return axios({
method: 'post',
url: `${base}${url}`,
data: params,
transformRequest: [function (data) {
let ret = '';
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&';
}
ret = ret.substring(0, ret.length - 1);
return ret;
}],
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
'accessToken': accessToken
}
});
};
this.postRequest("/question/getByConditionMp", this.searchForm).then(res => {
//请求成功后的代码省略...
})
searchForm中的数据如下(模板代码我就省略了):
searchForm: {
// 搜索框对应data对象
status: "",
question_type: "",
difficulty: "",
score: "",
pageNumber: 1, // 当前页数
pageSize: 10, // 页面大小
sort: "createTime", // 默认排序字段
order: "desc" // 默认排序方式
},
SpringBoot后端接收代码如下:
@RequestMapping(value = "/getByConditionMp", method = RequestMethod.POST)
@ResponseBody
@ApiOperation(value = "根据Condition查询,MP方式")
public Result<IPage<Map<String, Object>>> getByConditionMp(Question question, PageVo pageVo) {
System.out.println("参数为"+question.toString());
question.setId(null); //加这行的目的时我这里Id是利用代码逻辑生成的,即使查询操作也会有id生成,而我这里查询是基本不会用到id查询的,所以我就把id设置为null了
QueryWrapper<Question> queryWrapper = new QueryWrapper<>(question);
IPage<Map<String, Object>> page = PageUtil.initMpPage(pageVo);
iQuestionService.pageMaps(page, queryWrapper);
List<Map<String, Object>> records = page.getRecords();
以上代码能正常获取到后端数据,但是有一个非常奇怪的问题,前端初始页面时能正常获取到数据,根据页面上这几个条件查询也没有问题,然而表单利用this.$refs.searchForm.resetFields()重置以后,再重新请求后端,第一次点击重置按钮,就会报错(后端返回的错误)nested exception is java.lang.NumberFormatException: For input string: "undefined",第二次点击就不会报错,非常奇怪。
然后打开浏览器查看网络请求,发现凡是在搜索表单searForm中更改过的参数,在第一次重置的时候,都变成了undefined,而第二次点击又变成了什么都没有,应该就是空字符串。
于是尝试各种修改前端代码,都没能成功,问题依旧。
然而。。。我试着把post请求换成了get请求,同时把后端改成get请求,竟然不报错了。
前端请求代码片段如下:
export const getRequest = (url, params) => {
let accessToken = getStore('accessToken');
return axios({
method: 'get',
url: `${base}${url}`,
params: params,
headers: {
'accessToken': accessToken
}
});
};
this.getRequest("/question/getByConditionMp", this.searchForm).then(res => {
//请求成功后的代码省略...
})
后端代码就是把post换成了get而已,其他没有变:
@RequestMapping(value = "/getByConditionMp", method = RequestMethod.GET)
@ResponseBody
@ApiOperation(value = "根据Condition查询,MP方式")
public Result<IPage<Map<String, Object>>> getByConditionMp(Question question, PageVo pageVo) {
System.out.println("参数为"+question.toString());
question.setId(null); //加这行的目的时我这里Id是利用代码逻辑生成的,即使查询操作也会有id生成,而我这里查询是基本不会用到id查询的,所以我就把id设置为null了
QueryWrapper<Question> queryWrapper = new QueryWrapper<>(question);
IPage<Map<String, Object>> page = PageUtil.initMpPage(pageVo);
iQuestionService.pageMaps(page, queryWrapper);
List<Map<String, Object>> records = page.getRecords();
再也没有出现过前端请求的searchForm表单中的属性值是undefined的问题,我目前也不知道前端请求体里面显示undefined为什么还和后端有关系,留待日后完善或有大神告知吧。
另外,因为我前端查询时有like的有eq的,比如标题就是模糊查询,分数就是完全相等,这个怎么搞呢,我一开始搜了很多帖子都看不明白,我看有自己写注解往实体类上面加的,最后发现mybatis plus已经有现成的注解了,那就是:
@TableField(condition = SqlCondition.LIKE)
只需要把它放在需要模糊查询的实体类属性里面就可以了,就是这么简单。