react_15
动态菜单
图标要独立安装依赖
npm install @ant-design/icons
图标组件,用来将字符串图标转换为标签图标
import * as icons from "@ant-design/icons";
interface Module {[p: string]: any;
}
const all: Module = icons;
export default function Icon({ name }: { name: string }) {const Icon = all[name];return <Icon></Icon>;
}
登录页面
import { Button, Form, Input, message } from "antd";
import RoutesStore from "../store/RoutesStore";
import { LoginReq } from "../model/Student";
import { observer } from "mobx-react-lite";
import { useNavigate } from "react-router-dom";
import { useEffect } from "react";function A8Login() {function onFinish(values: LoginReq) {RoutesStore.login(values);}const nav = useNavigate();useEffect(() => {if (RoutesStore.state === "success") {//登陆成功,跳转到主页nav("/");} else if (RoutesStore.state === "error") {//登录失败message.error(RoutesStore.message);}}, [RoutesStore.state]);return (<div style={{ paddingTop: 200 }}><Formname="basic"labelCol={{ span: 8 }}wrapperCol={{ span: 8 }}onFinish={onFinish}><Form.Itemlabel="用户名"name="username"rules={[{ required: true, message: "用户名必须" }]}><Input autoComplete="off" /></Form.Item><Form.Itemlabel="密码"name="password"rules={[{ required: true, message: "密码必须" }]}><Input.Password autoComplete="off" /></Form.Item><Form.Item wrapperCol={{ offset: 8, span: 6 }}><Button type="primary" htmlType="submit">登录</Button></Form.Item></Form></div>);
}
export default observer(A8Login);
-
用 useNavigate() 返回的函数跳转的代码不能包含在函数式组件的主逻辑中,只能放在
-
其它事件处理函数中
-
写在副作用函数 useEffect 之中
-
相关文章:
react_15
动态菜单 图标要独立安装依赖 npm install ant-design/icons 图标组件,用来将字符串图标转换为标签图标 import * as icons from "ant-design/icons"; interface Module {[p: string]: any; } const all: Module icons; export default function Ico…...
关于ROS的网络通讯方式TCP/UDP
一、TCP与UDP TCP/IP协议族为传输层指明了两个协议:TCP和UDP,它们都是作为应同程序和网络操作的中介物。 **TCP(Transmission Control Protocol)协议全称是传输控制协议,是一种面向连接的、可靠的、基于字节流的传输…...
Leetcode—421.数组中两个数的最大异或值【中等】明天写一下字典树做法!!!
2023每日刷题(十九) Leetcode—421.数组中两个数的最大异或值 算法思想 参考自灵茶山艾府 实现代码 class Solution { public:int findMaximumXOR(vector<int>& nums) {int maxValue *max_element(nums.begin(), nums.end());int highId…...
数智赋能!麒麟信安参展全球智慧城市大会
10月31日至11月2日,为期三天的2023全球智慧城市大会长沙在湖南国际会展中心举办,大会已连续举办12届,是目前全球规模最大、专注于城市和社会智慧化发展及转型的主题展会。长沙市委常委、常务副市长彭华松宣布开幕,全球智慧城市大会…...
基础课21——知识库管理
1.知识库的概念、特点与功能 智能客服中的知识库是一个以知识为基础的系统,可以明确地表达与实际问题相对应的知识,并构成相对独立的程序行为主体,有利于有效、准确地解决实际问题。它储存着机器人对所有信息的认知概念和理解,这…...
网络运维Day01
文章目录 环境准备OSI七层参考模型什么是协议?协议数据单元(PDU)设备与层的对应关系什么是IP地址?IP地址分类IP的网络位和主机位IP地址默认网络位与主机位子网掩码默认子网掩码查看IP地址安装CISCO汉化CISCO(可选操作) CISCO之PC机器验证通信 CISCSO之交…...
从零配置一台linux主机
1. Linux软件安装方式 软件安装教程 设置国内源 因为 linux 本身自带的下载源资源有限,所以在使用 apt 命令下载的时候,有些包可能找不到,所以要添加国内源。方法如下: 打开文件 /etc/apt/sources.list sudo gedit /etc/apt/s…...
【蓝桥每日一题]-倍增(保姆级教程 篇1)
今天讲一下倍增 目录 题目:忠诚 思路: 题目:国旗计划 思路: 查询迭代类倍增: 本质是一个一个选区间使总长度达到 M,类似凑一个数。而我们会经常用不大于它最大的二的次幂,减去之后,再重复这…...
CNN(卷积神经网络)、RNN(循环神经网络)和GCN(图卷积神经网络)
CNN(卷积神经网络): 区别:CNN主要适用于处理网格状数据,如图像或其他二维数据。它通过卷积层、池化层和全连接层来提取和学习输入数据的特征。卷积层使用卷积操作来捕捉局部的空间结构,池化层用于降低特征图…...
在markdown中怎么画表格
2023年11月5日,周日上午 下面是一种常用的方式来编写表格: | 列1标题 | 列2标题 | 列3标题 | |:------:|:------:|:------:| | 内容 | 内容 | 内容 | | 内容 | 内容 | 内容 |在这个示例中,第一行用于定义表格的列标…...
每天五分钟计算机视觉:搭建手写字体识别的卷积神经网络
本文重点 我们学习了卷积神经网络中的卷积层和池化层,这二者都是卷积神经网络中不可缺少的元素,本例中我们将搭建一个卷积神经网络完成手写字体识别。 卷积和池化的直观体现 手写字体识别 手写字体的图片大小是32*32*3的,它是一张 RGB 模式的图片,现在我们想识别它是从 …...
【React】【react-globe.gl】3D Objects效果
目录 想要实现的效果实现过程踩坑安装依赖引入页面 想要实现的效果 示例地址 实现过程 踩坑 示例是通过script引入的依赖,但本人需要在react项目中实现该效果。按照react-globe.gl官方方法引入总是报错 Cant import the named export AmbientLight from non EcmaS…...
目标检测YOLO系列从入门到精通技术详解100篇-【目标检测】SLAM(补充篇)
目录 前言 知识储备 SLAM基础知识 算法原理 什么是SLAM SLAM算法框架...
Pytorch 缓解过拟合和网络退化
一 添加BN模块 BN模块应该添加 激活层前面 在模型实例化后,我们需要对BN层进行初始化。PyTorch中的BN层是通过nn.BatchNorm1d或nn.BatchNorm2d类来实现的。 bn nn.BatchNorm1d(20) # 对于1D输入数据,使用nn.BatchNorm1d;对于2D输入数据&am…...
【算法】昂贵的聘礼(dijkstra算法)
题目 年轻的探险家来到了一个印第安部落里。 在那里他和酋长的女儿相爱了,于是便向酋长去求亲。 酋长要他用 10000 个金币作为聘礼才答应把女儿嫁给他。 探险家拿不出这么多金币,便请求酋长降低要求。 酋长说:”嗯,如果你能够替我…...
hackergame2023菜菜WP
文章目录 总结Hackergame2023更深更暗组委会模拟器猫咪小测标题HTTP集邮册Docker for everyone惜字如金 2.0Git? Git!高频率星球低带宽星球小型大语言模型星球旅行日记3.0JSON ⊂ YAML? 总结 最近看到科大在举办CTF比赛,刚好我学校也有可以参加,就玩了…...
ubuntu20.04.6使用FTP-及相关安全配置
前言: 作为一名运维,对文件系统,网络,文件共享,内存,CPU,以及一些应用服务及监控相关的知识需要 了解。今天是自己第一次搭建FTP(以前用过smb,windows共享,FT…...
C++中不允许复制的类
C中不允许复制的类 假设您需要模拟国家的政体。一个国家只能有一位总统,而 President 类面临如下风险: President ourPresident; DoSomething(ourPresident); // duplicate created in passing by value President clone; clone ourPresident; // dup…...
使用Python 脚自动化操作服务器配置
“ 有几十台特殊的服务器,没有合适的批量工具只能手动,要一个一个进行点击设置很耗费时间呀\~”,使用 Python 的简单脚本,即可模拟鼠标键盘进行批量作业 01 — 自动化示例 以某服务器中的添加用户权限为例,演示过程皆未触碰鼠标…...
DL Homework 6
目录 一、概念 (1)卷积 (2)卷积核 (3)特征图 (4)特征选择 (5)步长 (6)填充 (7)感受野 二、探究不同卷…...
【JavaSE】绘图与事件入门学习笔记
-Java绘图坐标体系 坐标体系-介绍 坐标原点位于左上角,以像素为单位。 在Java坐标系中,第一个是x坐标,表示当前位置为水平方向,距离坐标原点x个像素;第二个是y坐标,表示当前位置为垂直方向,距离坐标原点y个像素。 坐标体系-像素 …...
大数据学习(132)-HIve数据分析
🍋🍋大数据学习🍋🍋 🔥系列专栏: 👑哲学语录: 用力所能及,改变世界。 💖如果觉得博主的文章还不错的话,请点赞👍收藏⭐️留言Ǵ…...
USB Over IP专用硬件的5个特点
USB over IP技术通过将USB协议数据封装在标准TCP/IP网络数据包中,从根本上改变了USB连接。这允许客户端通过局域网或广域网远程访问和控制物理连接到服务器的USB设备(如专用硬件设备),从而消除了直接物理连接的需要。USB over IP的…...
九天毕昇深度学习平台 | 如何安装库?
pip install 库名 -i https://pypi.tuna.tsinghua.edu.cn/simple --user 举个例子: 报错 ModuleNotFoundError: No module named torch 那么我需要安装 torch pip install torch -i https://pypi.tuna.tsinghua.edu.cn/simple --user pip install 库名&#x…...
React---day11
14.4 react-redux第三方库 提供connect、thunk之类的函数 以获取一个banner数据为例子 store: 我们在使用异步的时候理应是要使用中间件的,但是configureStore 已经自动集成了 redux-thunk,注意action里面要返回函数 import { configureS…...
20个超级好用的 CSS 动画库
分享 20 个最佳 CSS 动画库。 它们中的大多数将生成纯 CSS 代码,而不需要任何外部库。 1.Animate.css 一个开箱即用型的跨浏览器动画库,可供你在项目中使用。 2.Magic Animations CSS3 一组简单的动画,可以包含在你的网页或应用项目中。 3.An…...
c# 局部函数 定义、功能与示例
C# 局部函数:定义、功能与示例 1. 定义与功能 局部函数(Local Function)是嵌套在另一个方法内部的私有方法,仅在包含它的方法内可见。 • 作用:封装仅用于当前方法的逻辑,避免污染类作用域,提升…...
Modbus RTU与Modbus TCP详解指南
目录 1. Modbus协议基础 1.1 什么是Modbus? 1.2 Modbus协议历史 1.3 Modbus协议族 1.4 Modbus通信模型 🎭 主从架构 🔄 请求响应模式 2. Modbus RTU详解 2.1 RTU是什么? 2.2 RTU物理层 🔌 连接方式 ⚡ 通信参数 2.3 RTU数据帧格式 📦 帧结构详解 🔍…...
【无标题】湖北理元理律师事务所:债务优化中的生活保障与法律平衡之道
文/法律实务观察组 在债务重组领域,专业机构的核心价值不仅在于减轻债务数字,更在于帮助债务人在履行义务的同时维持基本生活尊严。湖北理元理律师事务所的服务实践表明,合法债务优化需同步实现三重平衡: 法律刚性(债…...
AD学习(3)
1 PCB封装元素组成及简单的PCB封装创建 封装的组成部分: (1)PCB焊盘:表层的铜 ,top层的铜 (2)管脚序号:用来关联原理图中的管脚的序号,原理图的序号需要和PCB封装一一…...
