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

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 图标组件&#xff0c;用来将字符串图标转换为标签图标 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协议族为传输层指明了两个协议&#xff1a;TCP和UDP&#xff0c;它们都是作为应同程序和网络操作的中介物。 **TCP&#xff08;Transmission Control Protocol&#xff09;协议全称是传输控制协议&#xff0c;是一种面向连接的、可靠的、基于字节流的传输…...

Leetcode—421.数组中两个数的最大异或值【中等】明天写一下字典树做法!!!

2023每日刷题&#xff08;十九&#xff09; Leetcode—421.数组中两个数的最大异或值 算法思想 参考自灵茶山艾府 实现代码 class Solution { public:int findMaximumXOR(vector<int>& nums) {int maxValue *max_element(nums.begin(), nums.end());int highId…...

数智赋能!麒麟信安参展全球智慧城市大会

10月31日至11月2日&#xff0c;为期三天的2023全球智慧城市大会长沙在湖南国际会展中心举办&#xff0c;大会已连续举办12届&#xff0c;是目前全球规模最大、专注于城市和社会智慧化发展及转型的主题展会。长沙市委常委、常务副市长彭华松宣布开幕&#xff0c;全球智慧城市大会…...

基础课21——知识库管理

1.知识库的概念、特点与功能 智能客服中的知识库是一个以知识为基础的系统&#xff0c;可以明确地表达与实际问题相对应的知识&#xff0c;并构成相对独立的程序行为主体&#xff0c;有利于有效、准确地解决实际问题。它储存着机器人对所有信息的认知概念和理解&#xff0c;这…...

网络运维Day01

文章目录 环境准备OSI七层参考模型什么是协议&#xff1f;协议数据单元(PDU)设备与层的对应关系什么是IP地址&#xff1f;IP地址分类IP的网络位和主机位IP地址默认网络位与主机位子网掩码默认子网掩码查看IP地址安装CISCO汉化CISCO(可选操作) CISCO之PC机器验证通信 CISCSO之交…...

从零配置一台linux主机

1. Linux软件安装方式 软件安装教程 设置国内源 因为 linux 本身自带的下载源资源有限&#xff0c;所以在使用 apt 命令下载的时候&#xff0c;有些包可能找不到&#xff0c;所以要添加国内源。方法如下&#xff1a; 打开文件 /etc/apt/sources.list sudo gedit /etc/apt/s…...

【蓝桥每日一题]-倍增(保姆级教程 篇1)

今天讲一下倍增 目录 题目&#xff1a;忠诚 思路&#xff1a; 题目&#xff1a;国旗计划 思路&#xff1a; 查询迭代类倍增&#xff1a; 本质是一个一个选区间使总长度达到 M,类似凑一个数。而我们会经常用不大于它最大的二的次幂&#xff0c;减去之后&#xff0c;再重复这…...

CNN(卷积神经网络)、RNN(循环神经网络)和GCN(图卷积神经网络)

CNN&#xff08;卷积神经网络&#xff09;&#xff1a; 区别&#xff1a;CNN主要适用于处理网格状数据&#xff0c;如图像或其他二维数据。它通过卷积层、池化层和全连接层来提取和学习输入数据的特征。卷积层使用卷积操作来捕捉局部的空间结构&#xff0c;池化层用于降低特征图…...

在markdown中怎么画表格

2023年11月5日&#xff0c;周日上午 下面是一种常用的方式来编写表格&#xff1a; | 列1标题 | 列2标题 | 列3标题 | |:------:|:------:|:------:| | 内容 | 内容 | 内容 | | 内容 | 内容 | 内容 |在这个示例中&#xff0c;第一行用于定义表格的列标…...

每天五分钟计算机视觉:搭建手写字体识别的卷积神经网络

本文重点 我们学习了卷积神经网络中的卷积层和池化层,这二者都是卷积神经网络中不可缺少的元素,本例中我们将搭建一个卷积神经网络完成手写字体识别。 卷积和池化的直观体现 手写字体识别 手写字体的图片大小是32*32*3的,它是一张 RGB 模式的图片,现在我们想识别它是从 …...

【React】【react-globe.gl】3D Objects效果

目录 想要实现的效果实现过程踩坑安装依赖引入页面 想要实现的效果 示例地址 实现过程 踩坑 示例是通过script引入的依赖&#xff0c;但本人需要在react项目中实现该效果。按照react-globe.gl官方方法引入总是报错 Cant import the named export AmbientLight from non EcmaS…...

目标检测YOLO系列从入门到精通技术详解100篇-【目标检测】SLAM(补充篇)

目录 前言 知识储备 SLAM基础知识 算法原理 什么是SLAM SLAM算法框架...

Pytorch 缓解过拟合和网络退化

一 添加BN模块 BN模块应该添加 激活层前面 在模型实例化后&#xff0c;我们需要对BN层进行初始化。PyTorch中的BN层是通过nn.BatchNorm1d或nn.BatchNorm2d类来实现的。 bn nn.BatchNorm1d(20) # 对于1D输入数据&#xff0c;使用nn.BatchNorm1d&#xff1b;对于2D输入数据&am…...

【算法】昂贵的聘礼(dijkstra算法)

题目 年轻的探险家来到了一个印第安部落里。 在那里他和酋长的女儿相爱了&#xff0c;于是便向酋长去求亲。 酋长要他用 10000 个金币作为聘礼才答应把女儿嫁给他。 探险家拿不出这么多金币&#xff0c;便请求酋长降低要求。 酋长说&#xff1a;”嗯&#xff0c;如果你能够替我…...

hackergame2023菜菜WP

文章目录 总结Hackergame2023更深更暗组委会模拟器猫咪小测标题HTTP集邮册Docker for everyone惜字如金 2.0Git? Git!高频率星球低带宽星球小型大语言模型星球旅行日记3.0JSON ⊂ YAML? 总结 最近看到科大在举办CTF比赛&#xff0c;刚好我学校也有可以参加&#xff0c;就玩了…...

ubuntu20.04.6使用FTP-及相关安全配置

前言&#xff1a; 作为一名运维&#xff0c;对文件系统&#xff0c;网络&#xff0c;文件共享&#xff0c;内存&#xff0c;CPU&#xff0c;以及一些应用服务及监控相关的知识需要 了解。今天是自己第一次搭建FTP&#xff08;以前用过smb&#xff0c;windows共享&#xff0c;FT…...

C++中不允许复制的类

C中不允许复制的类 假设您需要模拟国家的政体。一个国家只能有一位总统&#xff0c;而 President 类面临如下风险&#xff1a; President ourPresident; DoSomething(ourPresident); // duplicate created in passing by value President clone; clone ourPresident; // dup…...

使用Python 脚自动化操作服务器配置

“ 有几十台特殊的服务器&#xff0c;没有合适的批量工具只能手动&#xff0c;要一个一个进行点击设置很耗费时间呀\~”,使用 Python 的简单脚本&#xff0c;即可模拟鼠标键盘进行批量作业 01 — 自动化示例 以某服务器中的添加用户权限为例&#xff0c;演示过程皆未触碰鼠标…...

DL Homework 6

目录 一、概念 &#xff08;1&#xff09;卷积 &#xff08;2&#xff09;卷积核 &#xff08;3&#xff09;特征图 &#xff08;4&#xff09;特征选择 &#xff08;5&#xff09;步长 &#xff08;6&#xff09;填充 &#xff08;7&#xff09;感受野 二、探究不同卷…...

MPNet:旋转机械轻量化故障诊断模型详解python代码复现

目录 一、问题背景与挑战 二、MPNet核心架构 2.1 多分支特征融合模块(MBFM) 2.2 残差注意力金字塔模块(RAPM) 2.2.1 空间金字塔注意力(SPA) 2.2.2 金字塔残差块(PRBlock) 2.3 分类器设计 三、关键技术突破 3.1 多尺度特征融合 3.2 轻量化设计策略 3.3 抗噪声…...

无法与IP建立连接,未能下载VSCode服务器

如题&#xff0c;在远程连接服务器的时候突然遇到了这个提示。 查阅了一圈&#xff0c;发现是VSCode版本自动更新惹的祸&#xff01;&#xff01;&#xff01; 在VSCode的帮助->关于这里发现前几天VSCode自动更新了&#xff0c;我的版本号变成了1.100.3 才导致了远程连接出…...

初学 pytest 记录

安装 pip install pytest用例可以是函数也可以是类中的方法 def test_func():print()class TestAdd: # def __init__(self): 在 pytest 中不可以使用__init__方法 # self.cc 12345 pytest.mark.api def test_str(self):res add(1, 2)assert res 12def test_int(self):r…...

微软PowerBI考试 PL300-在 Power BI 中清理、转换和加载数据

微软PowerBI考试 PL300-在 Power BI 中清理、转换和加载数据 Power Query 具有大量专门帮助您清理和准备数据以供分析的功能。 您将了解如何简化复杂模型、更改数据类型、重命名对象和透视数据。 您还将了解如何分析列&#xff0c;以便知晓哪些列包含有价值的数据&#xff0c;…...

Reasoning over Uncertain Text by Generative Large Language Models

https://ojs.aaai.org/index.php/AAAI/article/view/34674/36829https://ojs.aaai.org/index.php/AAAI/article/view/34674/36829 1. 概述 文本中的不确定性在许多语境中传达,从日常对话到特定领域的文档(例如医学文档)(Heritage 2013;Landmark、Gulbrandsen 和 Svenevei…...

IP如何挑?2025年海外专线IP如何购买?

你花了时间和预算买了IP&#xff0c;结果IP质量不佳&#xff0c;项目效率低下不说&#xff0c;还可能带来莫名的网络问题&#xff0c;是不是太闹心了&#xff1f;尤其是在面对海外专线IP时&#xff0c;到底怎么才能买到适合自己的呢&#xff1f;所以&#xff0c;挑IP绝对是个技…...

JS手写代码篇----使用Promise封装AJAX请求

15、使用Promise封装AJAX请求 promise就有reject和resolve了&#xff0c;就不必写成功和失败的回调函数了 const BASEURL ./手写ajax/test.jsonfunction promiseAjax() {return new Promise((resolve, reject) > {const xhr new XMLHttpRequest();xhr.open("get&quo…...

Go语言多线程问题

打印零与奇偶数&#xff08;leetcode 1116&#xff09; 方法1&#xff1a;使用互斥锁和条件变量 package mainimport ("fmt""sync" )type ZeroEvenOdd struct {n intzeroMutex sync.MutexevenMutex sync.MutexoddMutex sync.Mutexcurrent int…...

Web中间件--tomcat学习

Web中间件–tomcat Java虚拟机详解 什么是JAVA虚拟机 Java虚拟机是一个抽象的计算机&#xff0c;它可以执行Java字节码。Java虚拟机是Java平台的一部分&#xff0c;Java平台由Java语言、Java API和Java虚拟机组成。Java虚拟机的主要作用是将Java字节码转换为机器代码&#x…...

三分算法与DeepSeek辅助证明是单峰函数

前置 单峰函数有唯一的最大值&#xff0c;最大值左侧的数值严格单调递增&#xff0c;最大值右侧的数值严格单调递减。 单谷函数有唯一的最小值&#xff0c;最小值左侧的数值严格单调递减&#xff0c;最小值右侧的数值严格单调递增。 三分的本质 三分和二分一样都是通过不断缩…...