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

react ant icon的简单使用

refer: 快速上手 - Ant Design

1.引入ant

npm install antd --save

2.在页面引用:

import { StarOutlined } from '@ant-design/icons';

如果想要引入多个icon,可以这样书写:

import { UserOutlined, MailOutlined, PieChartOutlined } from '@ant-design/icons';

上面这行代码就是在页面引入了ant的icon StarOutlined,在页面显示的是一个空心的星星

3.在需要的位置使用这个icon

<Button type="primary" onClick={() => this.handleViewClick(record.id)}><StarOutlined />查看</Button>

上面这段代码是在查看这个button左侧增加了这个星星icon,如果你想设置css,例如居右8px等,可以使用:

<StarOutlined style={{ marginRight: 8 }} />

如果是在''中引用,可以这样书写:

{title: (<span><StarOutlined style={{ marginRight: 8 }} />所属计算方案名称</span>),dataIndex: 'calculation_plan_name',key: 'calculation_plan_name',},

 

 

相关文章:

react ant icon的简单使用

refer: 快速上手 - Ant Design 1.引入ant npm install antd --save 2.在页面引用&#xff1a; import { StarOutlined } from ant-design/icons; 如果想要引入多个icon&#xff0c;可以这样书写&#xff1a; import { UserOutlined, MailOutlined, PieChartOutlined } fr…...

用Rust实现23种设计模式之原型模式

在 Rust 中&#xff0c;原型模式可以通过实现 Clone trait 来实现。原型模式是一种创建型设计模式&#xff0c;它允许通过复制现有对象来创建新对象&#xff0c;而无需显式地使用构造函数。下面是一个使用 Rust 实现原型模式的示例&#xff0c;带有详细的代码注释和说明&#x…...

visual studio 2022 编译时出现MSB3721问题

cuda1C:\code\SSR\Impl\Dev\gE\cO\G.Common.XrayRegistration_nc>“C:\Program Files\NVIDIA GPU Computing Toolkit\CUDA\v11.7\bin\nvcc.exe” -gencodearchcompute_86,code“sm_86,compute_86” --use-local-env -ccbin “C:\Program Files\Microsoft Visual Studio\2022…...

Android 获取网络连接状态新方法

一. 问题背景 Android12上&#xff0c;有的app模块判断当前网络的类型和连接状态时&#xff0c;还是使用的旧的API&#xff0c;导致返回的结果不准确&#xff0c;影响代码逻辑判断&#xff0c;本篇文章就这一问题&#xff0c;整理一下判断网络类型和连接状态的新方法。 二. 原因…...

可缝合神经网络

文章目录 Stitchable Neural Networks摘要本文方法实验结果 Stitchable Neural Networks 摘要 包含大量强大的预训练模型族(如ResNet/DeiT)的model zoo已经达到了前所未有的范围&#xff0c;这对深度学习的成功有重要贡献。由于每个模型族都由具有不同尺度的预训练模型(例如&…...

Android优化篇|网络预连接

作者&#xff1a;苍耳叔叔 一个示例 前后分别去请求同一个域名下的接口&#xff0c;通过 Charles 抓包&#xff0c;可以看到 Timing 下面的时间&#xff1a; 第二次请求时&#xff0c;DNS、Connect 和 TLS Handshake 部分都是 -&#xff0c;说明没有这部分的耗时&#xff0c;…...

pyspark使用XGboost训练模型实例

遇到一个还不错的使用Xgboost训练模型的githubhttps://github.com/MachineLP/Spark-/tree/master/pyspark-xgboost 1、这是一个跑通的代码实例&#xff0c;使用的是泰坦尼克生还数据&#xff0c;分类模型。 这里使用了Pipeline来封装特征处理和模型训练步骤&#xff0c;保存为…...

完整模型的训练套路

从心所欲 不逾矩 天大地大 皆可去 一、官方模型的初使用 使用VGG16模型 VGG模型使用代码示例&#xff1a; import torchvision.models from torch import nndataset torchvision.datasets.CIFAR10(/cifar10, False, transformtorchvision.transforms.ToTensor())vgg16_true …...

PtahDAO:全球首个DAO治理资产信托计划的金融平台

金融科技是当今世界最具创新力和影响力的领域之一&#xff0c;区块链技术作为金融科技的核心驱动力&#xff0c;正在颠覆传统的金融模式&#xff0c;为全球用户提供更加普惠、便捷、安全的金融服务。在这个变革的浪潮中&#xff0c;PtahDAO&#xff08;普塔道&#xff09;作为全…...

从零搭建一个react + electron项目

最近打算搭建一个react electron的项目&#xff0c;发现并不是那么傻瓜式 于是记录一下自己的实践步骤 通过create-react-app 创建react项目 npx create-react-app my-app 安装electron依赖 npm i electron -D暴露react项目的配置文件&#xff08;这一步看自己需求&#xff0c…...

MATLAB /Simulink 快速开发STM32(使用st官方工具 STM32-MAT/TARGET),以及开发过程

配置好环境以后就是开发&#xff1a; stm32cube配置芯片&#xff0c;打开matlab添加ioc文件&#xff0c;写处理逻辑&#xff0c;生成代码&#xff0c;下载到板子中去。 配置需要注意事项&#xff1a; STM32CUBEMAX6.5.0 MABLAB2022BkeilV5.2 Matlab生成的代码CTRLB 其中关键的…...

LeetCode 热题 100 JavaScript--102. 二叉树的层序遍历

给你二叉树的根节点 root &#xff0c;返回其节点值的 层序遍历 。 &#xff08;即逐层地&#xff0c;从左到右访问所有节点&#xff09;。 输入&#xff1a;root [3,9,20,null,null,15,7] 输出&#xff1a;[[3],[9,20],[15,7]] 示例 2&#xff1a; 输入&#xff1a;root [1…...

常见Git命令

Git常见命令 1. 添加单个文件 git add a.txt2. 添加多个文件 git add a.txt b.txt c.txt3. 添加(commit)修改&#xff0c;此时修改还未push到服务器上 git commit -m "修改了a.txt内容"4. 提交(push)修改&#xff0c;此时修改会同步到服务器上 git push5. 查看当…...

在C语言中调用汇编语言的函数

在C语言中调用汇编文件中的函数&#xff0c;要做的主要工作有两个&#xff1a; 一是在C语言中声明函数原型&#xff0c;并加extern关键字&#xff1b; 二是在汇编中用EXPORT导出函数名&#xff0c;并用该函数名作为汇编代码段的标识&#xff0c;最后用mov pc, lr返回。然后&a…...

Delphi Professional Crack,IDE插件开发和扩展IDE

Delphi Professional Crack,IDE插件开发和扩展IDE 构建具有强大视觉设计功能的单源多平台本机应用程序。 Delphi帮助您使用Object Pascal为Windows、Mac、Mobile、IoT和Linux构建和更新数据丰富、超连接、可视化的应用程序。Delphi Professional适合个人开发人员和小型团队构建…...

程序框架-公共MONO模块

作用&#xff1a;让没有继承MONO的类可以开启协程&#xff0c;可以update更新&#xff0c;可以统一管理update MonoController脚本继承MonoBehaviour使得脚本过场不移除&#xff0c;并通过UnityAction可以添加多个函数&#xff08;多播委托&#xff09;&#xff0c;实现Update…...

采用鲁棒随机森林实现的流异常检测:Python应用的一种新型机器学习方法

在数字化和互联网化日益普遍的现代社会,处理海量的网络流量数据是网络安全分析中不可或缺的一部分。流异常检测是一种重要的技术,用于发现可能的安全威胁,例如:网络攻击、恶意行为和系统故障等。随机森林是一种普遍用于解决这类问题的机器学习算法。在本文中,我们将介绍一…...

缓存友好在实际编程中的重要性

引入 当CPU执行程序时&#xff0c;需要频繁地访问主存储器&#xff08;RAM&#xff09;中的数据和指令。然而&#xff0c;主存储器的访问速度相对较慢&#xff0c;与CPU的运算速度相比存在显著差异&#xff0c;每次都从主存中读取数据都会导致相对较长的等待时间&#xff0c;从…...

uni-ajax网络请求库使用

uni-ajax网络请求库使用 uni-ajax是什么 uni-ajax是基于 Promise 的轻量级 uni-app 网络请求库,具有开箱即用、轻量高效、灵活开发 特点。 下面是安装和使用教程 安装该请求库到项目中 npm install uni-ajax编辑工具类request.js // ajax.js// 引入 uni-ajax 模块 import ajax…...

MYSQL进阶-事务

1.什么是数据库事务&#xff1f; 事务是一个不可分割的数据库操作序列&#xff0c;也是数据库并发控制的基本单位&#xff0c;其执 行的结果必须使数据库从一种一致性状态变到另一种一致性状态。事务是逻辑上 的一组操作&#xff0c;要么都执行&#xff0c;要么都不执行。 事务…...

AppleRa1n终极指南:5步轻松绕过iOS 15-16激活锁的完整教程

AppleRa1n终极指南&#xff1a;5步轻松绕过iOS 15-16激活锁的完整教程 【免费下载链接】applera1n icloud bypass for ios 15-16 项目地址: https://gitcode.com/gh_mirrors/ap/applera1n 还在为忘记Apple ID密码而无法使用自己的iPhone发愁吗&#xff1f;或者购买了二手…...

如何快速生成自己的数字人?亲测指南

数字人已成为短视频营销、跨境电商等领域的新工具&#xff0c;如何快速生成自己的数字人&#xff1f;本文结合亲测经验&#xff0c;分享实用方法。 一、数字人生成的核心步骤&#xff08;3步搞定&#xff09; 生成数字人无需复杂技术&#xff0c;只需三步即可完成。首先&#x…...

PowerPaint-V1 Gradio在文化遗产保护中的应用:古画修复与数字化

PowerPaint-V1 Gradio在文化遗产保护中的应用&#xff1a;古画修复与数字化 1. 引言 一幅珍贵的古代山水画&#xff0c;因为年代久远出现了多处破损和褪色&#xff1b;一张历史照片&#xff0c;因为保存不当而出现了霉斑和裂纹。这些文化遗产的损坏&#xff0c;往往意味着一段…...

Typora笔记完美发布CSDN:图片自动上传+排版优化保姆级教程

Typora 图像上传 完整操作说明 发现问题 当我们使用Typora这款强大的Markdown编辑器记录笔记时&#xff0c;经常会遇到一个让人困扰的问题&#xff1a;在将笔记上传到CSDN博客或者其他网站上后&#xff0c;图片无法正确显示。这不仅会大大降低我们的效率&#xff0c;还可能给…...

[ISP] CIE-XYZ色彩空间的现代应用与优化

1. CIE-XYZ色彩空间的诞生与核心原理 1931年国际照明委员会&#xff08;CIE&#xff09;做了一件改变色彩科学史的事——他们用汞灯发出的三个特定波长光线&#xff08;700nm红、546.1nm绿、435.8nm蓝&#xff09;作为基准&#xff0c;通过大量人眼视觉实验绘制出了著名的CIE-…...

Qwen3Guard-Gen-8B开箱即用:离线内容审核,保护你的AI应用免受风险

Qwen3Guard-Gen-8B开箱即用&#xff1a;离线内容审核&#xff0c;保护你的AI应用免受风险 1. 为什么需要离线内容审核&#xff1f; 在AI应用快速发展的今天&#xff0c;内容安全问题日益突出。无论是社交媒体、在线客服还是内容创作平台&#xff0c;都可能面临以下风险&#…...

InsightFace系统部署教程:从零开始搭建人脸分析Web界面

InsightFace系统部署教程&#xff1a;从零开始搭建人脸分析Web界面 1. 引言&#xff1a;为什么你需要一个本地化的人脸分析工具 想象一下&#xff0c;你手头有一批活动照片需要快速整理&#xff0c;想知道照片里每个人的大致年龄和性别分布&#xff0c;或者需要分析一段视频中…...

AI开发-python-langchain框架(--EasyOCR图片文字提取 )访

本文能帮你解决什么&#xff1f; 1. 搞懂FastAPI异步&#xff08;async/await&#xff09;到底在什么场景下能真正提升性能。 2. 掌握在FastAPI中正确使用多线程处理CPU密集型任务的方法。 3. 避开常见的坑&#xff08;比如阻塞操作、数据库连接池耗尽、GIL限制&#xff09;。 …...

实时手机检测-通用GPU算力优化:TensorRT加速后吞吐量提升3.2倍

实时手机检测-通用GPU算力优化&#xff1a;TensorRT加速后吞吐量提升3.2倍 1. 引言&#xff1a;当手机检测遇上性能瓶颈 想象一下&#xff0c;在一个大型活动现场&#xff0c;安保系统需要实时分析数百路监控视频&#xff0c;精准识别出每一部正在使用的手机&#xff0c;以防…...

【开源】从设计文档到可交付技术交底书:专利.Skill

【开源】从设计文档到可交付技术交底书&#xff1a;专利.Skill 摘要 设计文档、代码都有了&#xff0c;专利点却还没梳清&#xff1f;交底书既要系统框图与流程图&#xff0c;又要代理人能直接改的 Word&#xff0c;多轮补材料还不能覆盖旧稿&#xff1f;本文介绍开源仓库 pat…...