【问题解决】 avue dicUrl 动态参数加载字典数据(已解决)

2023-11-01 07:20

本文主要是介绍【问题解决】 avue dicUrl 动态参数加载字典数据(已解决),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

    事情是这样的,用了avue-crud组件,配置了一个option。
    现在有一列source属性要展示为 多选的下拉框 ,当然问题不在这而在于,选项是需要根据同级别属性id去拿的。也就是option.column.source 的配置中 需要该行的option.column.id作为参数。大致是这样。
    如下是我问GPT的问题——这是aven-crud的option的column的项, prop为’source’的项的dicUrl如何获得另一个同样传递过来的、跟source同级的属性prop: 'id’作为参数?

{prop: 'id',span: 24,type: 'input',label: '主键',display: false,hide: true},
{prop: 'source',span: 24,type: 'select',multiple: true, // 多选label: '节点对应模块',rules: [{message: '节点对应模块必须填写',required: true}],required: true,// dicData: [{//     label: '字典1',//     value: 0// }, {//     label: '字典2',//     value: 1// }, {//     label: '字典3',//     value: 2// }],dicUrl: '/bz/node?id=???',props: {label: 'source',value: 'source'},search: true,searchMultiple: true,searchLabelWidth: '35%'},

    当然GPT也没给出什么好办法,网上的很多方法也进行了尝试,总归都不行,大家可以从注释行看到做了多少尝试。。虽然更多的删掉了。
在这里插入图片描述

    最后是从 Avue使用本地/网络数据字典 中获得了启发,解决了问题,总体而言就是 不操作dicUrl直接给dicData赋值 ,虽然理论上这种方法操作dicUrl也行得通,但是鬼知道js会不会即时加载改变的dicUrl获取数据,也懒得试了。

解决

  1. avue-crud组件里v-model绑定一个form属性,同时在数据那里初始化返回form空对象
    在这里插入图片描述
    在这里插入图片描述

  2. avue-crud组件里把option设为 .sync(不知道有没有用)
    在这里插入图片描述

  3. watch里面监听 form.id,此时handler的val就是变化的id,handler里面有个参数是那个immediate:true,大概是即时生效的意思,具体也不是很懂。
    在这里插入图片描述
    在这里插入图片描述

    大致的步骤就是这样,更多的属于个人的需求了,得益于form.id一旦变化是立刻被监听到的,算是把列表查询里和增改弹窗里的下拉框各查了一次去赋值,所以watch里的操作还写不少的。虽然功能是实现了,但是有时候属实有点卡,希望是在房里连公司网络不好使的原因。。

这篇关于【问题解决】 avue dicUrl 动态参数加载字典数据(已解决)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/321389

相关文章

GSON框架下将百度天气JSON数据转JavaBean

《GSON框架下将百度天气JSON数据转JavaBean》这篇文章主要为大家详细介绍了如何在GSON框架下实现将百度天气JSON数据转JavaBean,文中的示例代码讲解详细,感兴趣的小伙伴可以了解下... 目录前言一、百度天气jsON1、请求参数2、返回参数3、属性映射二、GSON属性映射实战1、类对象映

504 Gateway Timeout网关超时的根源及完美解决方法

《504GatewayTimeout网关超时的根源及完美解决方法》在日常开发和运维过程中,504GatewayTimeout错误是常见的网络问题之一,尤其是在使用反向代理(如Nginx)或... 目录引言为什么会出现 504 错误?1. 探索 504 Gateway Timeout 错误的根源 1.1 后端

Web服务器-Nginx-高并发问题

《Web服务器-Nginx-高并发问题》Nginx通过事件驱动、I/O多路复用和异步非阻塞技术高效处理高并发,结合动静分离和限流策略,提升性能与稳定性... 目录前言一、架构1. 原生多进程架构2. 事件驱动模型3. IO多路复用4. 异步非阻塞 I/O5. Nginx高并发配置实战二、动静分离1. 职责2

解决升级JDK报错:module java.base does not“opens java.lang.reflect“to unnamed module问题

《解决升级JDK报错:modulejava.basedoesnot“opensjava.lang.reflect“tounnamedmodule问题》SpringBoot启动错误源于Jav... 目录问题描述原因分析解决方案总结问题描述启动sprintboot时报以下错误原因分析编程异js常是由Ja

C# LiteDB处理时间序列数据的高性能解决方案

《C#LiteDB处理时间序列数据的高性能解决方案》LiteDB作为.NET生态下的轻量级嵌入式NoSQL数据库,一直是时间序列处理的优选方案,本文将为大家大家简单介绍一下LiteDB处理时间序列数... 目录为什么选择LiteDB处理时间序列数据第一章:LiteDB时间序列数据模型设计1.1 核心设计原则

Java+AI驱动实现PDF文件数据提取与解析

《Java+AI驱动实现PDF文件数据提取与解析》本文将和大家分享一套基于AI的体检报告智能评估方案,详细介绍从PDF上传、内容提取到AI分析、数据存储的全流程自动化实现方法,感兴趣的可以了解下... 目录一、核心流程:从上传到评估的完整链路二、第一步:解析 PDF,提取体检报告内容1. 引入依赖2. 封装

深度剖析SpringBoot日志性能提升的原因与解决

《深度剖析SpringBoot日志性能提升的原因与解决》日志记录本该是辅助工具,却为何成了性能瓶颈,SpringBoot如何用代码彻底破解日志导致的高延迟问题,感兴趣的小伙伴可以跟随小编一起学习一下... 目录前言第一章:日志性能陷阱的底层原理1.1 日志级别的“双刃剑”效应1.2 同步日志的“吞吐量杀手”

MySQL 表空却 ibd 文件过大的问题及解决方法

《MySQL表空却ibd文件过大的问题及解决方法》本文给大家介绍MySQL表空却ibd文件过大的问题及解决方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考... 目录一、问题背景:表空却 “吃满” 磁盘的怪事二、问题复现:一步步编程还原异常场景1. 准备测试源表与数据

解决Nginx启动报错Job for nginx.service failed because the control process exited with error code问题

《解决Nginx启动报错Jobfornginx.servicefailedbecausethecontrolprocessexitedwitherrorcode问题》Nginx启... 目录一、报错如下二、解决原因三、解决方式总结一、报错如下Job for nginx.service failed bec

python中的显式声明类型参数使用方式

《python中的显式声明类型参数使用方式》文章探讨了Python3.10+版本中类型注解的使用,指出FastAPI官方示例强调显式声明参数类型,通过|操作符替代Union/Optional,可提升代... 目录背景python函数显式声明的类型汇总基本类型集合类型Optional and Union(py