jeecg之列表查询获取后台获取参数获取不到

最新推荐文章于 2023-09-05 11:03:34 发布
原创 最新推荐文章于 2023-09-05 11:03:34 发布 · 2k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

未调试之前代码，也就是错误代码：
jsp页面：

<t:datagrid name="interfaceList" title="接口权限管理" actionUrl="interfaceController.do?interfaceGrid" idField="id" fit="true" pageSize="20" queryMode="group" btnCls="bootstrap btn btn-normal btn-xs">
   		<t:dgCol title="编号" field="id" hidden="true"></t:dgCol>
   		<t:dgCol title="一级接口权限名称"  field="interface_name1"  query="true"></t:dgCol>
   		<t:dgCol title="二级接口权限名称"  field="interface_name2" query="true"></t:dgCol>
   		<t:dgCol title="三级接口权限名称" field="interface_name3" query="true"></t:dgCol>
		<t:dgCol title="接口权限编码" field="interface_url" query="true"></t:dgCol>
		<t:dgCol title="请求方式" field="interface_method" query="false"></t:dgCol>
		<t:dgCol title="排序" field="interface_order" query="false"></t:dgCol>
		<t:dgCol title="操作" field="opt"></t:dgCol>
		<t:dgDelOpt url="interfaceController.do?del&id={id
最低0.47元/天 解锁文章

200万优质内容无限畅学
jeecg-boot高级查询组件中传递参数的注意事项
玉之之的博客
03-28 3109
首先我们了解到jeecg-boot的公共JeecgListMixin.js中： getQueryParams() { //获取查询条件 let sqp = {} if(this.superQueryParams){ //字符串加密 sqp['superQueryParams']=encodeURI(this.superQueryParams) sqp['superQueryMatchType'] = this.superQueryMatchType } ...
jeecg boot 企业级应用管理后台 （二）目录说明和项目部署 从0开始 (持续更新)
qq_46685188的博客
07-22 1812
用于项目在打包后，需要动态修改配置的需求，如接口地址。只需要修改 primaryColor 为您需要的配色，然后重新执行。或者对应的开发环境配置文件内，新增需要可动态配置的变量，需要以。用于配置缓存内容加密信息，对缓存到浏览器的信息进行 AES 加密。项目配置文件用于配置项目内展示的内容、布局、文本等效果，存于。用于修改项目的配色、布局、缓存、多语言、组件默认配置。, /api 需要是唯一的，不要和接口有的名字冲突。内的变量，刷新即可更新代码内的局部变量。项目的环境变量配置位于项目根目录下的。
jeecg单表数据查询
qq_42799116的博客
09-28 2286
以医生表，通过名称查询医生信息为例 一、确定返回的字段信息 1、类名称 DoctorReqVo.java 2、位置 jeecg-boot-base-common/src/main/java/org.jeecg.common/modules/doctor/vo/ 3、类细节 package org.jeecg.common.modules.doctor.vo; import lombok.AllArgsConstructor; import lombok.Builder; import lombok.
jeesite 参数验证失败
Tarzan的博客
11-07 1981
服务器参数验证失败
POST方式参数接收不到问题
u013648515的博客
08-31 1万+
工作上的项目，前后端分离的架构，后端典型的sping-MVC，Spring，Mybatis架构。 与前端同事联调接口过程中发现： 后台跑在我本地，前端以POST方式请求的时候，如果采取form-data格式发送数据，后台的controller中可以正常接收到数据，但是如果采用x-www-form-urlencoded方式发送数据，后台的controller中就接收不到参数了。 但是后台跑在公
jeecg t:upload 使用后台取参数问题
namefeng的专栏
07-01 4953
String deptName = request.getParameter("dept_id");//后台取formdata值 <input type="hidden" id="dept_id" name="deptName" value="${deptName}"><t:upload name="fiels" buttonText="选择要导入的文件" uploader="msgGroup
jeecgboot上传文件到服务器,Jeecg-Boot 技术文档
weixin_32200879的博客
07-31 2006
# JEditableTable 帮助文档## 参数配置| 参数 | 类型 | 必填 | 说明 ||--------------|---------|------|--------------------------------...
JEECG 开发指南v3.6.pdf )
06-30
- **在线表单开发**：利用 JEECG 的在线表单设计器，可以在不编写任何代码的情况下设计出复杂的表单界面，并能实时预览效果。表单设计器支持拖拽式操作，提供了丰富的控件选项，如文本框、下拉框、日期选择器等。 - ...
解决：springboot+vue表单提交后台接收不到值的问题
weixin_44615754的博客
06-10 4002
问题：vue前端表单数据post提交之后，后台controller拿不到值 前言：今天做多条件查询提交表单之后，发现后台拿不到值，在后端controller加上@RequestBody还是拿不到，最后，使用qs完美解决了问题 项目环境：springboot+vue前后端分离 代码贴出来供参考： 重点在于： var qs = require('querystring') qs.stringify(this.formInline) vue-page /*多条件查询方法*/ onsubmit(formNa
action传参数，后台接受不到
yanwuhuo的博客
07-11 318
HTML的代码:(关键是要在form里设置enctype=“multipart/form-data”,这样才能在提交表单时,将文件以二进制流的形式传输到服务器) 在form里面加入enctype="multipart/form-data"服务器就能接收到
jeecg常见问题
10-21
详细描述了jeecg平台开发过程中可能遇到的诸如内存溢出之类的问题
JeecgBoot 后台服务API调用方式详解
lbsgb的博客
09-05 5103
很多同学在部署JeecgBoot后，不知如何利用后台服务API进行调试。下面我来跟大家说一下是怎样调用的。调通一个接口后，其他接口就可以调用成功了。
Jeecg前台和后台获取当前登录人信息
kkk109A的博客
01-10 2595
一、前台 1.首先引入store import store from '@/store' 2.使用store let username = store.getters.userInfo.username 二、后台 LoginUser sysUser = (LoginUser)SecurityUtils.getSubject().getPrincipal();
备忘一下jvxetable的各种数据集获取方法
rocklee的专栏
07-05 1349
。
JeecgBoot 三级联动+后台获取数据
mctlilac的博客
03-02 9809
JeecgBoot 三级联动+后台获取数据 2020年03月02日 三级联动实例界面 找到前端VUE代码页 <template> <j-editable-table :columns="columns" :dataSource="dataSource" :rowNumber="true" :actionButton="true" :r...
【JEECG技术博文】Jeecg高级查询器
热门推荐
JEECG官方博客
12-15 1万+
一、背景对于用户来讲查询功能按易用性分三个层次：1. 最简单查询操作是一个输入框，全文检索，如百度，后台实现技术使用搜索引擎，需要设计和建立索引，技术较为复杂，适用于文档和信息数据库检索，但是结果很难精确控制。2. 其次是定义字段查询，很多企业信息系统大多用的是这种查询，针对模块特定字段的查询，有针对性、使用门坎低，适用于企业内部信息管理系统模块定制。3. 最后一种是专门针对数据模型灵活的查询编辑
基于JEECG-BOOT的list页面的地址栏参数传递
技术+管理+经验+沟通+人品=>合格的项目管理者
06-29 2747
基于JEECG-BOOT的list页面的地址栏参数传递。
关于数据菜单如何从后端获取数据
qq_56769991的博客
03-26 2564
通常前端页面会设计一个树型类型的菜单，而这些菜单的内容又需要根据我们的业务而定，这些数据是动态变化的 那么我们的后端该如何设计数据库呢？ 这里我们采用id-parentId的形式进行设计数据库 只要知道了一个跟结点的id，我们就可以根据这个id看成parentId去数据库中查询 where parentId=#{parentId}就可以查到一个结点的子节点，这样一层一层遍历。就可以遍历出整个树形结构。当然上面只是简单的说一下，具体的逻辑还要看下面的讲解。 如何设计数据库 首先每个结点需要需要一个唯一的i
jeecg里的JVXETable + vue + ant
空&白的博客
05-02 1542
JEECG文档:http://doc.jeecg.com/2043868 JVXETable:http://doc.jeecg.com/2043991 项目可以添加商品，十多条或者上百上千条数据，因为在做的时候，没有考虑到上千条数据的问题，后面造成前端页面卡顿，毫无体验感，所以进行改造。 JVXETable因为可以设置虚拟滚动，比JEditableTable可以更好的显示上百或者上千条数据，而不会造成前端页面卡顿的问题 引入JVXETable import { JVXETypes } from '@/com
如何将 URL 参数自动绑定到 Jeecgboot 表单组件？
最新发布
08-07
<think>我们正在使用Jeecgboot（Vue3版本），需要将URL参数自动绑定到表单组件。在Jeecgboot框架中，表单通常使用Ant Design Vue的组件，并且结合Jeecg提供的增强功能。 实现思路： 1. 获取URL参数（使用Vue Router的useRoute获取当前路由的参数） 2. 将参数绑定到表单的数据模型（通常是一个ref或reactive对象） 3. 如果表单组件是Jeecg封装的表单（如JFormContainer、JForm等），我们可以利用其内置的绑定机制 具体步骤： 步骤1：在setup中获取路由参数 步骤2：将参数赋值给表单的model 步骤3：如果参数需要作为查询条件，可以在页面加载时自动触发查询（比如列表页的筛选表单） 但是，Jeecgboot提供了一些便捷的方法，特别是在其生成的代码中，我们可以利用其内置的机制。 参考Jeecgboot的在线表单和代码生成，我们可以发现，在生成的列表页中，查询条件表单通常是通过URL参数初始化的。 例如，在列表页的代码中，我们通常可以看到这样的逻辑： 然而，Jeecgboot并没有直接提供一个自动绑定所有URL参数到表单的指令，但我们可以通过以下方式实现： 方法1：手动绑定（适用于简单场景） 方法2：使用Jeecg提供的工具方法（如果有的话）或封装一个通用的绑定方法 由于Jeecgboot的Vue3版本中，我们通常使用组合式API，因此可以这样做： 示例代码： 假设我们有一个表单模型：queryParam，它包含多个字段。 在列表页的setup中： ```typescript import { useRoute } from 'vue-router'; import { reactive, onMounted } from 'vue'; // 定义查询表单模型 const queryParam = reactive({ name: '', age: undefined, deptId: '' }); // 获取路由 const route = useRoute(); // 初始化时绑定参数 onMounted(() => { // 将路由参数赋值给queryParam // 注意：route.query中的参数都是字符串类型，需要根据实际类型转换 if (route.query) { // 遍历queryParam的每个字段，如果路由参数中有，则赋值 Object.keys(queryParam).forEach(key => { if (route.query[key] !== undefined) { // 这里简单处理，实际可能需要类型转换（比如数字类型） queryParam[key] = route.query[key] as string; } }); } }); ``` 但是，如果表单字段比较多，或者需要类型转换，我们可以写一个辅助函数： ```typescript // 定义一个辅助函数，将URL参数绑定到目标对象，并尝试转换数字 function bindUrlParamsToModel(urlParams: Record<string, any>, target: Record<string, any>) { Object.keys(target).forEach(key => { if (urlParams[key] !== undefined) { // 如果目标字段是数字类型，且urlParams[key]是数字字符串，则转换为数字 if (typeof target[key] === 'number') { target[key] = Number(urlParams[key]) || 0; } else { target[key] = urlParams[key]; } } }); } // 使用 onMounted(() => { bindUrlParamsToModel(route.query, queryParam); }); ``` 方法3：使用Jeecgboot内置的机制（如果有） 根据引用[4]中提到的，在Online表单配置中，可以通过配置联动字段来实现一些绑定，但这里我们需要的是从URL参数绑定。 实际上，在Jeecgboot生成的代码中，列表页的查询条件表单已经实现了从URL参数初始化。我们可以参考其实现。 在Jeecgboot的源码中，有一个`useListPage`的钩子，它可能已经处理了URL参数。但是，由于我们使用的是Vue3版本，我们可以查看Jeecgboot提供的`useListPage`或类似钩子。 但是，如果没有现成的钩子，我们可以自己封装。 方法4：封装一个自定义hook（推荐） 我们可以创建一个自定义hook：`useUrlQueryParam`，用于将URL参数绑定到指定的响应式对象。 创建文件`src/hooks/useUrlQueryParam.ts`： ```typescript import { useRoute } from 'vue-router'; import { onMounted, watch } from 'vue'; // 绑定URL参数到目标对象（支持类型转换） export default function useUrlQueryParam(target: Record<string, any>) { const route = useRoute(); // 初始化绑定 const bindParams = () => { if (route.query) { Object.keys(target).forEach(key => { if (route.query[key] !== undefined) { // 如果目标字段是数字类型，且是数字字符串，则转换 if (typeof target[key] === 'number') { target[key] = Number(route.query[key]) || 0; } else { target[key] = route.query[key] as string; } } }); } }; onMounted(() => { bindParams(); }); // 监听路由变化，当路由参数变化时重新绑定（比如从当前页带参数跳转回来） watch( () => route.query, () => { bindParams(); }, { deep: true } ); } ``` 在组件中使用： ```typescript import useUrlQueryParam from '/@/hooks/useUrlQueryParam'; // 定义查询表单模型 const queryParam = reactive({ name: '', age: undefined as number | undefined, deptId: '' }); // 绑定URL参数 useUrlQueryParam(queryParam); ``` 这样，当页面加载时，以及路由参数变化时，都会自动将URL参数绑定到queryParam上。 方法5：在Jeecgboot的表单组件中使用（如果表单是JForm） 如果是在表单详情页，我们通常使用JForm组件，它有一个model属性，我们可以将URL参数绑定到model上。 例如，在详情页，我们可能有一个表单模型formData，并且需要根据URL参数中的id来加载数据。 但是，对于表单的初始值，我们通常不会直接绑定URL参数（除了id），而是通过id去后台查询数据。所以这种情况不适用。 因此，上述方法主要适用于查询表单。 注意事项： 1. 类型转换：URL参数都是字符串，需要根据目标字段类型转换（如数字、布尔值等） 2. 安全性：避免直接绑定到敏感字段，或者进行必要的校验 3. 监听路由变化：如果同一个页面，路由参数变化需要重新绑定，则需要监听route.query的变化 总结： 在Jeecgboot中，我们可以通过自定义hook的方式，实现URL参数到表单模型的自动绑定，提高开发效率。 相关问题： 1. 如何将URL参数自动绑定到Jeecgboot的JForm表单组件？ 2. 在Jeecgboot中如何实现表单字段和URL参数的同步更新（双向绑定）？ 3. Jeecgboot的列表页查询条件如何持久化到URL参数？ 4. 如何对URL参数进行类型转换？</think>在 Jeecgboot 中实现 URL 参数自动绑定到表单组件，可以通过以下方法实现： ### 解决方案（Vue3 组合式 API） ```typescript // 在表单组件中 <script setup lang="ts"> import { useRoute } from 'vue-router'; import { reactive, onMounted } from 'vue'; // 1. 获取路由实例 const route = useRoute(); // 2. 定义表单模型（与URL参数同名） const formModel = reactive({ id: '', name: '', status: '', // 其他表单字段... }); // 3. 自动绑定URL参数到表单 const bindUrlParamsToForm = () => { // 遍历表单字段，自动绑定同名URL参数 Object.keys(formModel).forEach(key => { if (route.query[key]) { // 类型转换处理 if (typeof formModel[key] === 'number') { formModel[key] = Number(route.query[key]); } else { formModel[key] = route.query[key] as string; } } }); }; // 4. 组件挂载时执行绑定 onMounted(() => { bindUrlParamsToForm(); // 可选：自动提交表单（根据需求） // handleSubmit(); }); // 5. 监听路由变化 watch( () => route.query, () => bindUrlParamsToForm(), { deep: true } ); </script> ``` ### 针对 Jeecgboot 的优化方案 Jeecgboot 提供了更高效的封装方式，特别适合在线表单生成的场景： ```typescript // 使用 Jeecgboot 内置工具（推荐） import { useRoute } from 'vue-router'; import { useForm } from '/@/components/Form'; // 在 setup 中 const [registerForm, { setFieldsValue }] = useForm(); // 自动绑定URL参数 watchEffect(() => { const params = route.query; // Jeecgboot 表单字段自动映射 setFieldsValue({ id: params.id || '', name: params.name || '', // 其他字段... }); }); ``` ### 配置说明（针对在线表单功能） 在 Jeecgboot 的在线表单配置中，可以直接启用 URL 参数绑定功能： 1. **进入在线表单设计器** - 选择目标表单 → 控件配置 → 高级设置 2. **启用参数绑定** ```json { "bindUrlParams": true, "fieldMappings": { "id": "userId", "name": "userName" } } ``` - `bindUrlParams`: 启用自动绑定 - `fieldMappings`: URL参数与表单字段映射（可选） 3. **保存配置后**，系统会自动生成绑定代码到表单组件中[^4] ### 特殊场景处理 #### 1. 类型转换 ```typescript // 在绑定方法中添加类型处理 const convertValue = (value: any, targetType: string) => { if (targetType === 'number') return Number(value) || 0; if (targetType === 'boolean') return value === 'true'; return value; }; // 使用 formModel[key] = convertValue(route.query[key], typeof formModel[key]); ``` #### 2. 加密参数处理 ```typescript import { Base64 } from 'js-base64'; // 解密参数 if (route.query.encrypted) { const decoded = Base64.decode(route.query.encrypted as string); formModel = Object.assign(formModel, JSON.parse(decoded)); } ``` #### 3. 表单联动控制 ```typescript // 根据URL参数控制表单状态 if (route.query.mode === 'view') { formModel.disabled = true; // 查看模式禁用编辑 } ``` ### 最佳实践建议 1. **安全验证** - 在绑定前验证参数： ```typescript import { useMessage } from '/@/hooks/web/useMessage'; const { createMessage } = useMessage(); if (route.query.id && !/^\d+$/.test(route.query.id as string)) { createMessage.error('ID参数格式错误！'); return; } ``` 2. **自动提交** - 绑定后自动查询： ```typescript const bindAndSearch = () => { bindUrlParamsToForm(); handleSubmit(); // 执行表单提交/查询 }; ``` 3. **参数持久化** - 表单修改后更新URL： ```typescript import { useRouter } from 'vue-router'; const router = useRouter(); watch(formModel, (newVal) => { router.replace({ query: { ...route.query, ...newVal } }); }, { deep: true }); ``` ### 示例：用户编辑页绑定ID参数 ```vue <!-- src/views/system/user/UserForm.vue --> <script setup lang="ts"> import { useRoute } from 'vue-router'; import { reactive, onMounted } from 'vue'; import { getUserById } from '/@/api/system/user'; const route = useRoute(); const formModel = reactive({ id: '', username: '', realname: '', // 其他字段... }); // 自动绑定并加载数据 onMounted(async () => { if (route.query.id) { formModel.id = route.query.id as string; const userData = await getUserById(formModel.id); Object.assign(formModel, userData); } }); </script> ``` > 通过以上方法，Jeecgboot 可以高效实现 URL 参数到表单的自动绑定，符合其低代码开发理念[^5]。对于复杂场景，建议使用 Jeecgboot 在线表单配置功能简化开发流程[^4]。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值