fast-crud select下拉框 实现多选功能及下拉框数据动态获取(通过接口获取)

  • 教程

    • fast-crud select
    • 示例
    • 配置
  • 需求:需求比较复杂
    1. 下拉框选项需要通过后端接口获取
    2. 实现多选功能

  • 由于这个前端框架使用逻辑比较复杂我也是第一次使用,所以只记录核心问题

  • 环境:vue3,typescript,fast-crud ,elementPlus

  • 效果
    在这里插入图片描述

    在这里插入图片描述

  • 代码

    // crud.tsx文件(/.ts也行 js应该也可以)
    
    import {
          accountApi } from '/@/api/user'; // 接口存放文件
    
    import _ from 'lodash-es';
    import {
          ElMessage } from 'element-plus';
    import {
          compute,dict } from '@fast-crud/fast-crud';
    
    
    // 省略配置
        return {
         
            crudOptions: {
         
                request: {
         
                    pageRequest,// 进入整页面自动调取的接口
                    addRequest,
                    delRequest,
                    editRequest,// 编辑保存接口
                    dictRequest
                },
                table: {
         
                    border: false,
                },
                actionbar: {
         
                    buttons: {
         
                        add: {
         
    
                        },
                    },
                },
                

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/953557.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

高性能现代PHP全栈框架 Spiral

概述 Spiral Framework 诞生于现实世界的软件开发项目是一个现代 PHP 框架,旨在为更快、更清洁、更卓越的软件开发提供动力。 特性 高性能 由于其设计以及复杂精密的应用服务器,Spiral Framework框架在不影响代码质量以及与常用库的兼容性的情况下&a…

天机学堂笔记1

FeignClient(contextId "course", value "course-service") public interface CourseClient {/*** 根据老师id列表获取老师出题数据和讲课数据* param teacherIds 老师id列表* return 老师id和老师对应的出题数和教课数*/GetMapping("/course/infoB…

lobechat搭建本地知识库

本文中,我们提供了完全基于开源自建服务的 Docker Compose 配置,你可以直接使用这份配置文件来启动 LobeChat 数据库版本,也可以对之进行修改以适应你的需求。 我们默认使用 MinIO 作为本地 S3 对象存储服务,使用 Casdoor 作为本…

沸点 | 聚焦嬴图Cloud V2.1:具备水平可扩展性+深度计算的云原生嬴图动力站!

近日,嬴图正式推出嬴图Cloud V2.1,此次发布专注于提供无与伦比的用户体验,包括具有水平可扩展性的嬴图Powerhouse的一键部署、具有灵活定制功能的管理控制台、VPC / 专用链接等,旨在满足用户不断变化需求的各项前沿功能&#xff0…

Linux---shell脚本练习

要求: 1、shell 脚本写出检测 /tmp/size.log 文件如果存在显示它的内容,不存在则创建一个文件将创建时间写入。 2、写一个 shel1 脚本,实现批量添加 20个用户,用户名为user01-20,密码为user 后面跟5个随机字符。 3、编写个shel 脚本将/usr/local 日录下…

LiveNVR监控流媒体Onvif/RTSP常见问题-二次开发接口jquery调用示例如何解决JS|axios调用接口时遇到的跨域问题

LiveNVR二次开发接口jquery调用示例如何解决JS|axios调用接口时遇到的跨域问题 1、接口调用示例2、JS调用遇到跨域解决示例3、axios请求接口遇到跨域问题3.1、post请求3.2、get请求 4、RTSP/HLS/FLV/RTMP拉流Onvif流媒体服务 1、接口调用示例 下面是完整的 jquery 调用示例 $.a…

Canvas简历编辑器-选中绘制与拖拽多选交互方案

Canvas简历编辑器-选中绘制与拖拽多选交互方案 在之前我们聊了聊如何基于Canvas与基本事件组合实现了轻量级DOM,并且在此基础上实现了如何进行管理事件以及多层级渲染的能力设计。那么此时我们就依然在轻量级DOM的基础上,关注于实现选中绘制与拖拽多选交…

服务器数据恢复—raid5故障导致上层ORACLE无法启动的数据恢复案例

服务器数据恢复环境&故障: 一台服务器上的8块硬盘组建了一组raid5磁盘阵列。上层安装windows server操作系统,部署了oracle数据库。 raid5阵列中有2块硬盘的硬盘指示灯显示异常报警。服务器操作系统无法启动,ORACLE数据库也无法启动。 服…

LabVIEW光流算法的应用

该VI展示了如何使用NI Vision Development Module中的光流算法来计算图像序列中像素的运动矢量。通过该方法,可以实现目标跟踪、运动检测等功能,适用于视频处理、机器人视觉和监控领域。程序采用模块化设计,包含图像输入、算法处理、结果展示…

Redis十大数据类型详解

Redis(一) 十大数据类型 redis字符串(String) string是redis最基本的类型,一个key对应一个value string类型是二进制安全的,意思是redis的string可以包含任何数据。例如说是jpg图片或者序列化对象 一个re…

Navicat Premium 16.0.90 for Mac 安装与free使用

步骤 0.下载 通过网盘分享的文件:Navicat Premium 16.0.90 链接: https://pan.baidu.com/s/12O22rXa9MiBPKKTGMELNIg 提取码: yyds 1.打开下好的 dmg 文件 (这个界面不要关闭) 2.将Navicat Premium 拖动至 Applications 这时出现 点击取消。 3.点开…

基于Springboot + vue实现的购物推荐网站

🥂(❁◡❁)您的点赞👍➕评论📝➕收藏⭐是作者创作的最大动力🤞 💖📕🎉🔥 支持我:点赞👍收藏⭐️留言📝欢迎留言讨论 🔥🔥&…

【大数据】机器学习-----最开始的引路

以下是关于机器学习的一些基本信息,包括基本术语、假设空间、归纳偏好、发展历程、应用现状和代码示例: 一、基本术语 样本(Sample): 也称为实例(Instance)或数据点(Data Point&…

【WPS】【WORDEXCEL】【VB】实现微软WORD自动更正的效果

1. 代码规范方面 添加 Option Explicit:强制要求显式声明所有变量,这样可以避免因变量名拼写错误等情况而出现难以排查的逻辑错误,提高代码的健壮性。使用 On Error GoTo 进行错误处理:通过设置错误处理机制,当代码执行…

No one knows regex better than me

No one knows regex better than me 代码分析,传了两个参数zero,first,然后$second对两个所传的参数进行了拼接 好比:?zero1&first2 传入后就是: 12 然后对$second进行了正则匹配,匹配所传入的参数是否包含字符串Yeedo|wa…

Docker 安装开源的IT资产管理系统Snipe-IT

一、安装 1、创建docker-compose.yaml version: 3services:snipeit:container_name: snipeitimage: snipe/snipe-it:v6.1.2restart: alwaysports:- "8000:80"volumes:- ./logs:/var/www/html/storage/logsdepends_on:- mysqlenv_file:- .env.dockernetworks:- snip…

【RDMA】 ZTR(Zero Touch RoCE)技术(无需配置PFC和ECN)

目录 什么是Zero Touch RoCE(ZTR) 硬件和软件需求 使用方式 实现机制 ZTR-RTTCC 的工作原理 ZTR -RTTCC性能 官方文档 什么是Zero Touch RoCE(ZTR) Zero Touch RoCE(ZTR)技术是NVIDIA开发的一种创新…

【python】OpenCV—Local Translation Warps

文章目录 1、功能描述2、原理分析3、代码实现4、效果展示5、完整代码6、参考 1、功能描述 利用液化效果实现瘦脸美颜 交互式的液化效果原理来自 Gustafsson A. Interactive image warping[D]. , 1993. 2、原理分析 上面描述很清晰了,鼠标初始在 C,也即…

大疆上云API基于源码部署

文章目录 大疆上云API基于源码部署注意事项1、学习官网2、环境准备注意事项3、注册成为DJI开发者4、下载前后端运行所需要的包/依赖前端依赖下载后端所需要的Maven依赖包 用到的软件可以在这里下载5、MySQL数据库安装安装MySQL启动MySQL服务在IDEA中配置MySQL的连接信息 6、Red…

AI学习路线图-邱锡鹏-神经网络与深度学习

1 需求 神经网络与深度学习 2 接口 3 示例 4 参考资料