当前位置: 首页 > news >正文

项目练习:若依管理系统字典功能-Vue前端部分

文章目录

  • 一、情景说明
  • 二、若依Vue相关代码及配置
    • 1、utils代码
    • 2、components组件
    • 3、api接口代码
    • 4、Vuex配置
    • 5、main.js配置
  • 三、使用方法
    • 1、html部分
    • 2、js部分

一、情景说明

我们在做web系统的时候,肯定会遇到一些常量选择场景。
比如,性别:男女。
状态:正常,异常。
这些常量选择就可以做成字典配置功能。

二、若依Vue相关代码及配置

1、utils代码

在这里插入图片描述

2、components组件

在这里插入图片描述

3、api接口代码

在这里插入图片描述

4、Vuex配置

在这里插入图片描述

5、main.js配置

// 字典数据组件
import DictData from '@/components/DictData'
DictData.install()import store from './store'
new Vue({router,store,render: h => h(App)
}).$mount('#app')

三、使用方法

在任意一个vue文件中

1、html部分

          <el-form-item label="状态"><el-radio-group v-model="form.status" v-removeAriaHidden><el-radiov-for="dict in dict.type.sys_normal_disable":key="dict.value":label="dict.value":value="dict.value">{{dict.label}}</el-radio></el-radio-group></el-form-item>

2、js部分

在这里插入图片描述
至于,dicts里配置的值,从数据库查看即可。

个人理解,至于字典这块的前端代码,为什么写的如此复杂,
我是不太理解的。
太绕,没看懂。

但是,直接这么copy,是可以直接使用的。

相关文章:

项目练习:若依管理系统字典功能-Vue前端部分

文章目录 一、情景说明二、若依Vue相关代码及配置1、utils代码2、components组件3、api接口代码4、Vuex配置5、main.js配置 三、使用方法1、html部分2、js部分 一、情景说明 我们在做web系统的时候&#xff0c;肯定会遇到一些常量选择场景。 比如&#xff0c;性别&#xff1a;…...

apache-skywalking-apm-10.1.0使用

apache-skywalking-apm-10.1.0使用 本文主要介绍如何使用apache-skywalking-apm-10.1.0&#xff0c;同时配合elasticsearch-8.17.0-windows-x86_64来作为存储 es持久化数据使用。 步骤如下&#xff1a; 一、下载elasticsearch-8.17.0-windows-x86_64 1、下载ES(elasticsear…...

计算机视觉算法实战——视频分析(Video Analysis)

✨个人主页欢迎您的访问 ✨期待您的三连 ✨ ✨个人主页欢迎您的访问 ✨期待您的三连 ✨ ✨个人主页欢迎您的访问 ✨期待您的三连✨ ​​​​​​ ​​​​​​​​​​​​ ​​​​​ 视频分析是计算机视觉中的一个重要领域&#xff0c;旨在从视频数据中提取有用的信息&…...

全网首发:编译libssh,产生类似undefined reference to `EVP_aes_256_ctr@OPENSSL_1_1_0‘的大量错误

具体错误 前面和后面的&#xff1a; /opt/linux/x86-arm/aarch64-mix210-linux/host_bin/../lib/gcc/aarch64-linux-gnu/7.3.0/../../../../aarch64-linux-gnu/bin/ld: warning: libcrypto.so.1.1, needed by ../lib/libssh.so.4.10.1, not found (try using -rpath or -rpat…...

用python实战excel和word自动化

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 python实现excel和word自动化--批量处理 前言--需求快要期末了需要&#xff0c;提交一个年级的学生成绩数据&#xff0c;也就是几百份。当前我们收集了一份excel表格&#xf…...

【云计算】OpenStack云计算平台

OpenStack云计算平台框架搭建 1.先换源 先换成阿里源: curl -o /etc/yum.repos.d/CentOS-Base.repo http://mirrors.aliyun.com/repo/Centos-7.repo 2.安装框架 yum -y install centos-release-openstack-train 3.安装客户端 yum -y install python-openstackclient 但…...

好用的php商城源码有哪些?

选择一个优秀的商城工具&#xff0c;能更好地帮助大家建立一个好用的商城系统。目前比较流行的都是开源PHP商城系统&#xff0c;那么现实中都有哪些好用的PHP商城源码值得推荐呢&#xff1f;下面就带大家一起来了解一下。 1.TigShop 【推荐指数】&#xff1a;★★★★★☆ 【推…...

docker安装Nginx UI

开源地址&#xff1a;nginx-ui/README-zh_CN.md at dev 0xJacky/nginx-ui GitHub docker run -dit \ --namenginx-ui \ --restartalways \ -e TZAsia/Shanghai \ -v /Users/xiaoping/docker/appdata/nginx:/etc/nginx \ -v /Users/xiaoping/docker/appdata/nginx-ui:/etc/ng…...

为深度学习创建PyTorch张量 - 最佳选项

为深度学习创建PyTorch张量 - 最佳选项 正如我们所看到的&#xff0c;PyTorch张量是torch.Tensor​ PyTorch类的实例。张量的抽象概念与PyTorch张量之间的区别在于&#xff0c;PyTorch张量为我们提供了一个可以在代码中操作的具体实现。 在上一篇文章中&#xff0c;我们看到了…...

详解数据增强中的平移shft操作

Shift 平移是指在数据增强&#xff08;data augmentation&#xff09;过程中&#xff0c;通过对输入图像或目标进行位置偏移&#xff08;平移&#xff09;&#xff0c;让目标在图像中呈现出不同的位置。Shift 平移的目的是增加训练数据的多样性&#xff0c;从而提高模型对目标在…...

CCLINKIE转ModbusTCP网关,助机器人“掀起”工业智能的“惊涛骇浪”

以下是一个稳联技术CCLINKIE转ModbusTCP网关&#xff08;WL-CCL-MTCP&#xff09;连接三菱PLC与机器人的配置案例&#xff1a;设备与软件准备设备&#xff1a;稳联技术WL-CCL-MTCP网关、三菱FX5UPLC、支持ModbusTCP协议的机器人、网线等。 稳联技术ModbusTCP转CCLINKIE网关&…...

类型安全与代码复用的C# 泛型

一、引言&#xff1a;泛型 ——C# 编程的神奇钥匙 在 C# 编程的广袤天地里&#xff0c;泛型宛如一把神奇钥匙&#xff0c;能够开启高效、灵活且安全的代码之门&#x1f6aa;。 想象一下&#xff0c;你是一位经验丰富的建筑师&#xff0c;要建造各种各样的房子&#x1f3e0;。…...

卷积神经05-GAN对抗神经网络

卷积神经05-GAN对抗神经网络 使用Python3.9CUDA11.8Pytorch实现一个CNN优化版的对抗神经网络 简单的GAN图片生成 CNN优化后的图片生成 优化模型代码对比 0-核心逻辑脉络 1&#xff09;Anacanda使用CUDAPytorch2&#xff09;使用本地MNIST进行手写图片训练3&#xff09;…...

vscode使用Marscode编程助手

下载 vscode 在插件里下载Marscode编程助手 插件完成 在这里点击安装&#xff0c;点击后这里出现AI编程插件。...

网络分析仪测试S参数

S参数的测试 一&#xff1a;S参数的定义 S参数&#xff08;Scattering Parameters&#xff0c;散射参数&#xff09;是一个表征器件在射频信号激励下的电气行为的工具&#xff0c;它以输入信号、输出信号为元素的矩阵来表现DUT的“传输”和“散射”效应&#xff0c;输入、输出…...

docker mysql5.7如何设置不区分大小写

环境 docker部署&#xff0c;镜像是5.7&#xff0c;操作系统是centos 操作方式 mysql 配置文件是放在 /etc/mysql/mysql.conf.d/mysqld.cnf&#xff0c; vim /etc/mysql/mysql.conf.d/mysqld.cnf lower_case_table_names1 重启mysql容器 验证 SHOW VARIABLES LIKE low…...

【1】Word:邀请函

目录 题目 文字解析 流程 题目 文字解析 考生文件夹☞Word.docx☞一定要用ms打开&#xff0c;wps打开作答无效☞作答完毕&#xff0c;F12或者手动另存为&#xff08;考生文件夹&#xff1a;路径文件名&#xff09; 注意&#xff1a;一定要检查&#xff0c;很有可能你前面步…...

【gin】中间件使用之jwt身份认证和Cors跨域,go案例

Gin-3 中间件编程及 JWT 身份认证 1. Gin 中间件概述 中间件是处理 HTTP 请求的函数&#xff0c;可以在请求到达路由处理函数之前或之后对请求进行处理。 在 Gin 框架中&#xff0c;中间件常用于处理日志记录、身份验证、权限控制等功能。 router : gin.Default() router.Us…...

【JAVA实战】@FeignClient注解类通用请求封装

背景 最近在编写多个系统数据集成过程中&#xff0c;经常会使用到FeignClient注解标记一个类&#xff0c;类里面编写很多请求方法&#xff0c;如果第三方系统有非常多的URL请求&#xff0c;每个方法对应一个URL请求&#xff0c;那么这个类就会非常的庞大&#xff0c;是否有一种…...

[c语言日寄]精英怪:三子棋(tic-tac-toe)3命慢通[附免费源码]

哈喽盆友们&#xff0c;今天带来《c语言》游戏中[三子棋boss]速通教程&#xff01;我们的目标是一边编写博文&#xff0c;一边快速用c语言实现三子棋游戏。准备好瓜子&#xff0c;我们计时开始&#xff01; 前期规划 在速通中&#xff0c;我们必须要有清晰的前期规划&#xf…...

ROS Noetic实战:从bag包里‘抠’出雷达点云和IMU数据的保姆级教程(Ubuntu 20.04)

ROS Noetic实战&#xff1a;从bag包里提取雷达点云和IMU数据的完整指南&#xff08;Ubuntu 20.04&#xff09;在机器人开发中&#xff0c;ROS bag文件就像是一个装满珍贵数据的宝箱&#xff0c;而雷达点云和IMU数据则是其中最闪亮的宝石。作为一名长期与ROS打交道的开发者&…...

终极免费方案:WandEnhancer完整解锁WeMod Pro功能快速指南

终极免费方案&#xff1a;WandEnhancer完整解锁WeMod Pro功能快速指南 【免费下载链接】Wand-Enhancer Advanced UX and interoperability extension for Wand (WeMod) app 项目地址: https://gitcode.com/gh_mirrors/we/Wand-Enhancer 你是否渴望享受WeMod Pro会员的所…...

Unity动态自然系统:Forest Environment-Dynamic Nature深度解析

1. 这不是“贴图堆砌”&#xff0c;而是自然系统级建模&#xff1a;Forest Environment-Dynamic Nature 的真实定位你有没有试过在Unity里拖进几棵树、铺点草、加个天空盒&#xff0c;然后发现场景像一张静止的风景明信片——风不动、叶不摇、雨不落、雾不散&#xff1f;我做过…...

【数据结构与算法】数据结构基础——栈和队列

目录栈和队列1. 栈1.1 栈的概念1.2 栈的实现方式分析1.3 栈的实现1.3.1 栈的初始化与销毁1.3.2 入栈与出栈1.3.3 栈的判空与有效元素个数1.3.4 栈顶元素1.4 栈的扩展1.4.1 两栈共享空间2. 队列2.1 队列的概念2.2 队列的实现方式分析2.3 队列的实现2.3.1 队列的初始化与销毁2.3.…...

危急时刻的六条基本安全提示

人机协作&#xff0c;AI模型&#xff1a;Deepseek 仅供参考 危急时刻的六条基本安全提示 以下内容仅为通用性安全建议&#xff0c;供在紧急情况下保持冷静、保护自身安全时参考。所有建议均基于常理和公共安全常识&#xff0c;不包含任何具体操作细节或可能被不当使用的信息…...

【大模型聚合平台深度评测:阿里云百炼 vs 腾讯云 ADP,企业如何选型?】

大模型聚合平台深度评测&#xff1a;阿里云百炼 vs 腾讯云 ADP&#xff0c;企业如何选型&#xff1f; 随着大模型技术的快速发展&#xff0c;越来越多的企业开始将 AI 能力融入到业务流程中。然而&#xff0c;面对市场上众多的大模型产品&#xff0c;企业往往面临着 “选择困难…...

告别依赖冲突:在Debian12上为特定项目搭建Python2.7.18独立运行环境

告别依赖冲突&#xff1a;在Debian12上为特定项目搭建Python2.7.18独立运行环境 当现代Linux系统已全面拥抱Python3的时代&#xff0c;突然需要维护一个仅支持Python2.7的遗留项目&#xff0c;这种场景对开发者而言无异于一场噩梦。本文将带你用工程化的思维&#xff0c;在Deb…...

8款网盘直链下载助手:彻底告别限速烦恼,实现高速下载自由

8款网盘直链下载助手&#xff1a;彻底告别限速烦恼&#xff0c;实现高速下载自由 【免费下载链接】Online-disk-direct-link-download-assistant 一个基于 JavaScript 的网盘文件下载地址获取工具。基于【网盘直链下载助手】修改 &#xff0c;支持 百度网盘 / 阿里云盘 / 中国移…...

DeepSeek-R1代码补全实测报告:37个真实项目、8类编程语言、48小时压测后,我删掉了Copilot

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;DeepSeek-R1代码补全实测报告总览 DeepSeek-R1 是深度求索&#xff08;DeepSeek&#xff09;推出的开源大语言模型&#xff0c;专为代码理解与生成任务优化。本章聚焦其在主流 IDE 环境中代码补全能力的…...

模式分层预测驱动推断:处理复杂缺失数据的统计新框架

1. 项目概述&#xff1a;当数据“缺胳膊少腿”时&#xff0c;如何做出靠谱的推断&#xff1f;在数据科学和统计建模的日常工作中&#xff0c;我们最怕遇到什么&#xff1f;不是复杂的算法&#xff0c;也不是海量的数据&#xff0c;而是数据本身“缺胳膊少腿”——也就是缺失值。…...