当前位置:首页 » 《休闲阅读》 » 正文

vue中数据字典dicts的说明和用法介绍

28 人参与  2024年03月22日 18:59  分类 : 《休闲阅读》  评论

点击全文阅读


一、什么是数据字典?

字典(dictionary)是一种数据结构,用于存储键-值对。字典是一个无序的集合,通过键来索引值。一般来说,在Python中,字典用花括号 {}标识,键值之间用 冒号:分隔,键-值对之间使用 , 分割。而在vue前端项目的开发中,也会使用到dicts字典。

二、数据字典的使用

1、字典初始化

// 字典数据组件----------->main.jsimport DictData from '@/components/DictData'// 字典组件挂载到Vue上当做插件使用DictData.install()

2、字典组件定义

// 组件----------->components/DictData/index.jsimport Vue from 'vue' //引入DataDict的模块或工具,包含数据字典相关的功能import DataDict from '@/utils/dict' //查询字典的方法(获取数据的接口)import { getDicts as getDicts } from '@/api/system/dict/data'function install() {//把DataDict当作一个插件安装到Vue实例中  Vue.use(DataDict, {//数据字典元信息    metas: {    //'*'表示这是一个通用配置,适用于所有数据字典      '*': {    //labelField 和 valueField 是用于指定数据字典项中标签和值的字段名        labelField: 'dictLabel',        valueField: 'dictValue',    //这个函数用来请求数据字典的数据,调用 getDicts() 函数,并使用传入的 dictMeta.type 来获取相应类型的数据字典        request(dictMeta) {          return getDicts(dictMeta.type).then(res => res.data)        },      },    },  })}export default {  install,}

其中,@/utils/dict文件里面主要是数据字典的一些方法,对于字典数据,标签,原始数据的处理;

'@/api/system/dict/data文件里面主要是字典接口,用于获取字典数据

3、使用数据字典

<el-select              clearable              v-model="queryForm.statusCd"              placeholder="请选择"              filterable              size="small"            >              <el-option                v-for="dict in dict.type.order_select_status"                :key="dict.value"                :label="dict.label"                :value="dict.value"              />            </el-select> dicts: ["order_select_status"], //引入状态字典

其中,order_select_status则是数据字典直接引用的“状态字典”

另外,还可自定义字典函数,这里就不做介绍了。

*写在最后:

什么是若依框架:若依框架就是一个后台管理框架,主要使用技术在官网可查,这里简要叙述:主要技术分别是基于springboot、shiro、mybatis、Thymeleaf等,这个后台管理框架可以实现零代码开发,它能让我们大部分时间放在业务开发上面,节省一些不必要的时间,降低技术难度,与开发成本。其中,也会在项目中大量用到字典。

---------------------------------------------------------------------------------------------------------------------------------

这是我最近学到关于数据字典的基本使用方法,可能解释的不是很全,若大家有更多见解可以留言,并指出错误,谢谢~

---------------------------------------------------------------------------------------------------------------------------------


点击全文阅读


本文链接:http://m.zhangshiyu.com/post/83883.html

<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

最新文章

  • 老公骗我在妇产科割痔疮后,我恢复了我城中村公主身份强推_李焱老公苏淼无广告阅读_小说后续在线阅读_无删减免费完结_
  • 全文我盼与你看朝暮免费+番外(苏念虞季司寒)列表_全文我盼与你看朝暮免费+番外
  • 小说苏眠谢临川(苏眠谢临川)已更新+无删减(将叹息折成蝴蝶)
  • 流光错系断蓬之舟结局(沈煜谢晚烟)全书浏览_流光错系断蓬之舟结局全书浏览
  • 七零首长重生,把夫人弄丢了在线列表_七零首长重生,把夫人弄丢了在线(苏棠顾云铮)
  • 七零首长重生,把夫人弄丢了在线苏棠顾云铮完本_七零首长重生,把夫人弄丢了在线(苏棠顾云铮)
  • 七零首长重生,把夫人弄丢了结局+番外+后续(苏棠顾云铮)全书免费_(苏棠顾云铮)七零首长重生,把夫人弄丢了结局+番外+后续后续(苏棠顾云铮)
  • 我一魔道老祖,去749局上班?无法释怀_陈瑄岳梦罗看点十足_小说后续在线阅读_无删减免费完结_
  • 穿越大乾,开局公主退婚我逆袭!(周毅朱微珍)_穿越大乾,开局公主退婚我逆袭!
  • 独家云非晚宋锦程小说小说大结局(老夫人她有喜啦)全篇在线下载阅读
  • 全文报告瞿总,夫人跟男大跑啦(许歆瑶谢潇然)列表_全文报告瞿总,夫人跟男大跑啦
  • 完结文折寒枝簪起霜思免费列表_完结文折寒枝簪起霜思免费(沈棠眠宋闻璟)

    关于我们 | 我要投稿 | 免责申明

    Copyright © 2020-2022 ZhangShiYu.com Rights Reserved.豫ICP备2022013469号-1