jeecgboot框架下拉框查询数据库中的某个字段

最新推荐文章于 2025-08-12 09:00:40 发布

原创最新推荐文章于 2025-08-12 09:00:40 发布 · 4.4k 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#java #vue #下拉列表查询

jeecgboot相关专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一个基于SpringBoot的后端查询接口与Vue前端的项目选择组件实现。后端通过@GetMapping注解提供查询服务，使用QueryWrapper进行条件筛选，返回符合条件的项目列表。前端采用Ant Design的Select组件，通过v-model双向绑定与v-for循环渲染项目名称，实现项目名称的选择功能。

查询页面：

后台部分

    @GetMapping("/queryProjectName")
    public Result<?> queryProjectName(){
    	QueryWrapper<YsxProject> queryWrapper=new QueryWrapper<YsxProject>();
    	queryWrapper.eq("del_flag",0).eq("project_status",2);
		List<YsxProject> list = ysxProjectService.list(queryWrapper);
		return Result.ok(list);
	}

vue部分

            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="项目名称">
                    <a-select  name="projectNameList" v-model="queryParam.projectId" placeholder="请选择项目名称">
                        <a-select-option value="">请选择</a-select-option>
                        <a-select-option v-for="item in projectNameList" :value="item.id"> {{item.projectName}}</a-select-option>
                    </a-select>
                </a-form-item>
            </a-col>

在这里插入图片描述

打印日志

添加页面

         <a-form-item label="项目名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-select  name="projectNameList" v-decorator="['projectId', validatorRules.projectId]" placeholder="请选择项目名称">
                  <a-select-option value="">请选择</a-select-option>
                  <a-select-option v-for="(item, index)  in projectNameList" :key="index.toString()" :value="item.id"> {{item.projectName}}</a-select-option>
              </a-select>
          </a-form-item>