当前位置: 首页 > 知识库问答 >
问题:

前端开发时关于icon图标或其它样式的维护?

翟俊远
2023-07-03

有些接口返回的都是根业务相关的状态信息,比如我最近在写邮件报告相关的业务,一个报告有很多状态 1-创建 2-草稿 3-提交 4-批准 5-发布 6-废弃 这些状态我在前端页面显示时都需要配一个icon图标 区分状态显得更好看些,我目前的做法是在util下定义常量 数组中要按后端数据库中这些状态的id大小顺序来定义的 这样我后面取方便些,现在我发现这种类似的接口后面会越来越多,可能都需要配icon图标或color颜色什么的样式 都需要我这样去用常量一个一个来定义吗 我想知道大家都是怎么维护的 有什么更好的方案吗

共有1个答案

姜乐家
2023-07-03

早些时候我也困惑过这样的问题 �� 项目中前端部分关于订单状态管理的一些疑问
最终是我是这样处理的 �� 项目中的类型和状态管理

但是实际情况下,我们项目当中会使用在管理后台维护字典的方式。所以其实是要在字典功能中增加对应的可维护字段。

 类似资料:
  • 字体图标 (bui-icon) 框架基于开源字体图标库:http://ionicons.com/     用法 <bui-icon name="ion-ios-bell" size=60></bui-icon> Example:bui-icon 属性 Prop Type Required Default Description name string Y 名称,来源于ionicons color

  • 介绍 基于字体的图标集,可以通过 Icon 组件使用,也可以在其他组件中通过 icon 属性引用。 引入 import { createApp } from 'vue'; import { Icon } from 'vant'; const app = createApp(); app.use(Icon); 代码演示 基础用法 Icon 的 name 属性支持传入图标名称或图片链接,所有可用的

  • mui默认提供了手机App开发常用的字体图标,如下:(点击icon即可复制样式) mui-icon-contact mui-icon-person mui-icon-personadd mui-icon-phone mui-icon-email mui-icon-chatbubble mui-icon-chatboxes mui-icon-weibo mui-icon-weixin mui-ico

  • 使用指南 组件介绍 Icon 组件是通过字体图标的方式引入 引入方式 import { Icon } from 'feart'; components: { 'fe-icon': Icon, }, 代码演示 默认 Icon <div class="fe-center"> <fe-icon name="placeholder" /> </div> 设置自定义大小颜色 <div

  • Icon 图标 提供了一套常用的图标集合。 使用方法 直接通过设置类名为 el-icon-iconName 来使用即可。例如: demo <i class="el-icon-edit"></i> <i class="el-icon-share"></i> <i class="el-icon-delete"></i> <el-button type="primary" icon="el-icon-s

  • 定义 字体图标 代码演示 <span className="icon-pile-artboard-add"></span> 属性 icon-pile-artboard-add icon-pile-artboard-reduce icon-pile-batch-export icon-pile-batch-import icon-pile-briefcase icon-pile-car icon-p