环境：

最近任务是基于jeecg-boot框架的，用的是jeecg-boot V2.4.0版。

功能实现：

有表“project_personnel_information”，需要从该表中根据指定的main_id过滤数据，并通过popup控件选取，需完成以下3步：

在online报表配置中进行配置，得到需要的数据列，具体配置如下图：

此处注意点击sql解析，解析通过才行。
代码如下：

<template><a-form :form="form" keep-source><a-form-item label="v-model模式指定一个值返回至当前组件" style="width: 300px"><j-popupv-model="selectValue"code="projectPersonEmilInfo"org-fields="name,mailbox"dest-fields="popup,other"field="popup":param="param1"/>{{ selectValue }}</a-form-item><a-form-item label="v-decorator模式支持回调多个值至当前表单" style="width: 300px"><j-popupv-decorator="['one']":trigger-change="true"code="projectPersonEmilInfo"org-fields="name,mailbox"dest-fields="one,two":param="param1"@callback="popupCallback"/>{{ getFormFieldValue('one') }}</a-form-item><a-form-item label="v-decorator模式被回调的值" style="width: 300px"><a-input v-decorator="['two']"></a-input></a-form-item></a-form >
</template><script>import JPopup from '@/components/jeecg/JPopup'export default {name: 'selectTest',    components: {JPopup},props:{      //popup动态参数 支持系统变量语法param:{}},data() {return {form: this.$form.createForm(this),        selectValue: " " ,id: "1353994922551246849",param1: {main_id: ""}}      },created:function() {//如果是流程中表单，则需要加载流程表单datathis.param1.main_id=this.id;this.param=this.param1},methods:{getFormFieldValue(field){        return this.form.getFieldValue(field)},popupCallback(row){this.form.setFieldsValue(row)}}}
</script>

路由配置：
具体操作见jeecg-boot开发文档

后话：

亲测有效，但是还是有报错：

vue.runtime.esm.js?2b0e:619 [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "param"

说父子组件传参param被子组件修改了，可是我子组件并没有对param进行key值修改，也有网友反馈说这是个bug，目前也不影响使用，所以就搁浅吧！如果有哪位大佬知道，也谢谢解答。

jeecg-boot中popup实现动态传参相关推荐

在Java中动态传参调用Python脚本
最近,又接触到一个奇葩的接口,基于老板不断催促赶时间的情况下,在重写java接口和复用已有的python脚本的两条路中选择了后者,但是其实后者并没有好很多,因为我是一个对python的认识仅限于其名称 ...
vue 中的动态传参和query传参
Vue router 如何传参 params.query 是什么? params:/router1/:id,这里的 id 叫做 params.例如/router1/123, /router1/789 ...
sql 不为空_sql动态传参在springData中的应用（补充）
在之前的文章提到过关于sql动态传参在springData中的应用,下面补充一下关于原生sql和springData的同一需求下的两种不同的写法: 需求:contoller层传递一个map给servi ...
中给函数赋读权限_sql动态传参在springData中的应用（补充）
在之前的文章提到过关于sql动态传参在springData中的应用,下面补充一下关于原生sql和springData的同一需求下的两种不同的写法: 需求:contoller层传递一个map给servi ...
函数动态传参详细，作用域和名称空间，global和nonlocal
1. 动态传参(重点) *, ** *, ** : 形参: 聚合位置参数* -> 元组关键字** -> 字典实参: 打散列表, 字符串, 元素 -> * 字典 -> * ...
python调用shell脚本的参数_使用python执行shell脚本并动态传参及subprocess的使用详解
最近工作需求中有遇到这个情况在web端获取配置文件内容及往shell 脚本中动态传入参数执行shell脚本这个有多种方法最后还是选择了subprocess这个python标准库 subpr ...
动态传参, 名称空间, 嵌套, gloabal, nonlocal
一, 动态传参 1. *args 接收到的是元组先用位置参数进行传参, 剩下的位置参数用*args进行传参 2. **kwargs 接收到的是一个字典先用关键字参数进行传参, 剩下的参数用**kw ...
js中使用进行字符串传参
在js中拼接html标签传参时,如果方法参数是字符串需要加上引号,这里需要进行字符转义 <a href='javascript:addMenuUI("+"\"&qu ...
v-for 循环 @click 动态传参（参数动态）
v-for 循环 @click 动态传参(参数动态) 代码示下: @click="function('id_'+data.id)" 以上就是关于"v-for 循环 @cl ...

jeecg-boot中popup实现动态传参

jeecg-boot中popup实现动态传参

环境：

功能实现：

后话：

jeecg-boot中popup实现动态传参相关推荐

最新文章

热门文章