【React】在项目中使用阿里图标库

文章目录

  1. 打开阿里图标库 ==》 选择相应图标项目
    在这里插入图片描述

  2. 选择Symbol格式,并复制链接

在这里插入图片描述

  1. 基于antd新建一个JS文件 MyIcon.js,并绑定上面复制的链接
import { createFromIconfontCN } from '@ant-design/icons';

// 图标有更新时,需更新下面图标链接
export const MyIcon = createFromIconfontCN({
  scriptUrl: '//at.alicdn.com/t/c/font_4427318_zv4a7bz2oo.js',
});
  1. 在项目中使用,先复制好图标代码,例如icon-add-file

在这里插入图片描述

  1. 将图标代码绑定到type
import { MyIcon } from '@/components/MyIcon';

export default function(){

	return (
		<MyIcon type="icon-add-file" style={{ fontSize: '15px' }} />
	)
}

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

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

相关文章

【数据结构之二叉树的构建和遍历】

数据结构学习笔记---009 数据结构之二叉树1、二叉树的概念和结构1.1、回顾二叉树的重要性质1.2、回顾二叉树的主要分类1.1、如何实现二叉树&#xff1f; 2、二叉树的实现2.1、二叉树的BinaryTree.h2.2、二叉树的BinaryTree.c2.2.1、二叉树的构建2.2.2、二叉树销毁2.2.3、二叉树…

【Time Series】LSTM代码实战

一、简介 还是那句话&#xff0c;"时间序列金融"是一个很有"钱"景的话题&#xff0c;还是想尝试采用Stock时间序列预测任务DeepLearning。本文提供了LSTM预测股票的源代码。 二、算法原理 长短期记忆网络&#xff08;LSTM&#xff09;是一种特殊的循环神经…

以“美”为鉴,探寻香港比特币现货ETF的未来发展

出品&#xff5c;欧科云链研究院 作者&#xff5c;Hedy Bi 根据The Block于1月29日的报道&#xff0c;嘉实国际成为了首家向香港证监会提交比特币现货ETF申请的机构。早在去年12月22日&#xff0c;香港证监会发布了《有关证监会认可基金投资虚拟资产的通函》&#xff0c;明确…

突破瓶颈,提升开发效率:Spring框架进阶与最佳实践-IOC

IOC相关内容 1.1 bean基础配置1.1.1 bean基础配置(id与class)1.1.2 bean的name属性步骤1&#xff1a;配置别名步骤2:根据名称容器中获取bean对象步骤3:运行程序 1.1.3 bean作用范围scope配置1.1.3.1 验证IOC容器中对象是否为单例验证思路具体实现 1.1.3.2 配置bean为非单例1.1.…

C++文件操作(1)

C文件操作 1.文本的写入及读取文本文件写入文本文件读取 2.二进制文件的写入及读取二进制文件写入二进制文件读取 3.小结 C也有处理文件的能力&#xff0c;其功能实现依赖文件流。文件流是C中用来处理文件输入输出的一种流类。文件流可以用于从文件中读取数据或将数据写入到文件…

开发工具git分支冲突解决

在团队协作的软件开发过程中&#xff0c;Git是一款广泛使用的版本控制系统。然而&#xff0c;当多个开发者同时修改同一文件或代码段时&#xff0c;就会产生分支冲突。解决这些冲突需要仔细的协调和技术知识。本篇博客将介绍Git分支冲突的解决方法&#xff0c;以及开发工具和最…

四工序开料机可以加工什么产品

四工序开料机是木工机械设备中一款重要设备&#xff0c;该设备主要的功能是开料、打孔、拉槽等&#xff0c;一机多用&#xff0c;凭借多功能的加工效果&#xff0c;实现高速加工的效果&#xff0c;那么这样的设备可以加工什么类型的产品呢&#xff1f;大家对此了解多少呢&#…

idea报错 :(java: 找不到符号)

java: 找不到符号 符号: 变量 adminService 位置: 类 com.example.controller.WebController 查到网上一个办法&#xff1a;因为项目是maven&#xff1a;先点clean在点package

anaconda离线安装包的方法

当设备没有网络时&#xff0c;可以使用有网络的设备先下载所需安装包&#xff0c;然后离线拷贝到需要安装的设备&#xff0c;最后安装。 一. 下载所需安装包 下载命令&#xff1a;使用pip download。详细描述参见pip download -h 以"blind-watermark"为例。 pip …

一站式在线协作办公软件ONLYOFFICE,协作更便捷

1、ONLYOFFICE是什么&#xff1f; ONLYOFFICE是一款功能强大的在线协作办公软件&#xff0c;可以创建编辑Word文档、Excel电子表格&#xff0c;PowerPoint&#xff08;PPT&#xff09;演示文稿、Forms表单等多种文件。ONLYOFFICE支持多个平台&#xff0c;无论使用的是 Windows、…

真机调试,微信小程序,uniapp项目在微信开发者工具中真机调试,手机和电脑要连同一个wifi,先清空缓存,页面从登录页进入,再点真机调试,这样就不会报错了

微信小程序如何本地进行真机调试&#xff1f;_unity生成的微信小程序怎么在电脑上真机测试-CSDN博客 微信小程序 真机调试 注意事项 uniapp项目在微信开发者工具中真机调试&#xff0c;手机和电脑要连同一个wifi&#xff0c;先清空缓存&#xff0c;页面从登录页进入&#xf…

怎么保护U盘数据?如何提高U盘的安全性?

U盘作为常用的移动储存设备&#xff0c;能够帮我们存储大量数据。而为了避免数据泄露&#xff0c;我们需要采用专业的方式提高U盘的安全性。那么&#xff0c;怎么保护U盘数据呢&#xff1f;下面我们就一起来了解一下。 如何提高U盘的安全性&#xff1f; 提高U盘数据安全性的方…

3DMAX一键生成样条线纤维插件使用方法

3DMAX一键生成样条线纤维插件使用教程 3DMAX一键生成样条线纤维插件&#xff0c;是一个强大的脚本工具&#xff0c;用于围绕选定的样条线路径创建纤维。它有许多设置用于微调纤维的形状和材质。 【适用版本】 3dMax2010 – 2024&#xff08;不仅限于此范围&#xff09; 【安装…

Rust基础篇之注释、函数

&#x1f339;作者主页&#xff1a;青花锁 &#x1f339;简介&#xff1a;Java领域优质创作者&#x1f3c6;、Java微服务架构公号作者&#x1f604; &#x1f339;简历模板、学习资料、面试题库、技术互助 &#x1f339;文末获取联系方式 &#x1f4dd; 往期专栏回顾 专栏描述…

Wireshark网络协议分析 - UDP协议

在我的博客阅读本文 文章目录 1. 基础2. 实战2.1. 用Go写一个简单的UDP服务器与客户端2.2. Wireshark抓包分析 3. UDP与TCP的区别4. 参考资料 1. 基础 UDP包的数据结构&#xff1a; 2. 实战 2.1. 用Go写一个简单的UDP服务器与客户端 我们这里使用Golang写了一个简单的9830端…

appsmith安装手记:4.Sql server数据库容器安装

appsmith安装好&#xff0c;那就可以看是练练手。 数据当然是来自数据库&#xff0c;那就连接局域网中现成的一台数据库服务器试试&#xff0c;但是连接数据库的时候一直错误。 找到/home/appsmith/backend 目录下的日志&#xff0c;看到了错误&#xff1a; [rootlocalhost bac…

【HarmonyOS应用开发】ArkUI 开发框架-基础篇-第二部分(八)

八、Column&Row组件的使用 概述 一个丰富的页面需要很多组件组成&#xff0c;那么&#xff0c;我们如何才能让这些组件有条不紊地在页面上布局呢&#xff1f;这就需要借助容器组件来实现。 容器组件是一种比较特殊的组件&#xff0c;它可以包含其他的组件&#xff0c;而…

Qt 调用系统键盘

Wow64DisableWow64FsRedirection(&pvoid) 函数用于禁用 32 位 Windows 程序对文件系统重定向的支持。它将禁用文件系统重定向&#xff0c;以便在运行 32 位应用程序时&#xff0c;可以访问 64 位系统目录。pvoid 是一个指向先前启用的文件系统重定向状态的指针。 构建了要…

《动手学深度学习(PyTorch版)》笔记4.8

注&#xff1a;书中对代码的讲解并不详细&#xff0c;本文对很多细节做了详细注释。另外&#xff0c;书上的源代码是在Jupyter Notebook上运行的&#xff0c;较为分散&#xff0c;本文将代码集中起来&#xff0c;并加以完善&#xff0c;全部用vscode在python 3.9.18下测试通过。…

文本三剑客之grep

目录 一、正则表达式 1、什么是正则表达式 2、元字符 3、扩展正则表达式元字符 二、grep 一、正则表达式 1、什么是正则表达式 REGEXP&#xff1a; Regular Expressions&#xff0c;由一类特殊字符及文本字符所编写的模式&#xff0c;其中有些字符&#xff08;元字符&#…