Vue查询数据的常见问题

最新推荐文章于 2023-07-27 13:37:36 发布

weixin_44540285

最新推荐文章于 2023-07-27 13:37:36 发布

阅读量1k

点赞数

文章标签： vue

本文链接：https://blog.youkuaiyun.com/weixin_44540285/article/details/116935565

版权

在使用Vue进行数据查询时，开发者可能会遇到一些问题。本文详细介绍了在VS Code中定位到Vue项目的API接口文件，特别是在`teacher.js`中设置查询参数时的注意事项。错误案例中提到了一个常见的问题——`Failed to convert value of type ‘java.lang.String’ to required type ‘long’`，这通常是由于URL字符串符号使用错误导致的类型转换失败。解决方案是确保URL的引用使用英文状态下的波浪符号`而不是单引号`。修复这个问题后，查询数据的问题就能得到解决。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我们要学习的东西有很多，在使用vue查询数据的时候，难免会有一些错误。
在VS Code里面，找到项目目录src里面的api文件夹里面的edu文件夹里面的teacher.js文件。

export default{

//1 讲师列表（条件查询分页）
//current当前页  limit每页记录数  teacherQuery条件对象
getTeacherListPage(current,limit,teacherQuery){
    return request({
       // url:'/table/list/'+current+"/"+limit,

url:/serviceedu/eduteacher/pageTeacherCondition/${current}/${limit},
method:‘post’,
//teacherQuery条件对象，后端使用RequestBody获取数据
//data表示把对象转换json进行传递到接口里面
data:teacherQuery
})
}
}

我们使用查询数据的核心就在这里，条件都要和idea对应，下面的链接选择复制稳妥一点，然后提交方式一样，然后在找到views—edu—teacher—list.vue文件。
data(){ //定义变量和初始值
return{
//listLoading:true, //是否显示loading信息
list:null, //查询之后接口返回集合
page:1, //当前页
limit:10, //每页记录数
total:0,//总记录数
teacherQuery:{}//条件封装对象
}
},
created(){ //页面渲染之前执行，一般调用methods定义的方法
//调用
this.getList()

在这里定义好变量和初始值，在进行调用。
在这里插入图片描述

在这个文件里面设置变量，然后在进行赋值，在输出数据，然后在上面设置表格内容，数据格式。在来执行一下，有些人可能会报这个错误。

Failed to convert value of type ‘java.lang.String’ to required type ‘long’; nested exception is java.lang.NumberFormatException: For input string: “${current}”

这个错误比较难找，说的是你没有转换类型，其实就是敲错了一个符号，就在你设置查询接口的那个地方。
url:/serviceedu/eduteacher/pageTeacherCondition/${current}/${limit},

这个链接两边要用英文状态下的波浪符号`,不要用单引号’,这样子错误就解决了。