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

Flutter路由

news 2025/9/14 7:41:11

路由作为一种页面切换的能力，非常重要。Flutter 中路由管理有几个重要的点。

Navigator 1.0：Flutter 早期路由系统，侧重于移动端 ，命令式编程风格，使用 Navigator.push() 和 Navigator.pop() 等方法来管理路由栈。

Navigator 2.0：Flutter1.22 版本以后新增，侧重于桌面端/网页端，声明式编程风格，使用 Router 和 RouteInformationParser 等类来描述和管理路由树。

Flutter路由重要的类

1.Route：应用程序页面的抽象， Navigator 管理 Route。

2.Navigator：负责路由管理的重要类，通过 push 和 pop 进行页面跳转。

Flutter 跳转方式

动态路由

适于单次导航的场景，直接在代码中创建和导航的路由。

Navigator.push(context,MaterialPageRoute(builder: (context) => RouterPageA()));

   Navigator.pop(context);
import 'package:flutter/material.dart';import 'dart_test_router1.dart';class TestRouterPage extends StatelessWidget {const TestRouterPage({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("Test Navigator"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("Test MaterialPageRoute"),ElevatedButton(onPressed: () {Navigator.push(context,MaterialPageRoute(builder: (context) => RouterPageA()));},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)],),),);}
}

import 'package:flutter/material.dart';class RouterPageA extends StatelessWidget {const RouterPageA({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text("RouterPageA"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("Test Navigator.pop"),ElevatedButton(onPressed: () {Navigator.pop(context);},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)],),),);}
}

Navigator.push有两个参数，一个是BuildContext，另一个是Route。代码中使用的是MaterialPageRoute，执行与对应平台风格一致的切换动画（android 与 ios平台不同）。如果使用 CupertinoPageRoute，页面切换效果是左右滑动。

PageRoute可以自定义，实现自定义页面切换的动画和行为。如果想自定义下过渡动画，使用 PageRouteBuilder 创建自定义路由，通过 pageBuilder 和 transitionsBuilder 属性来定义页面和过渡动画。

通过 pageBuilder 实现页面渐入动画

                Navigator.of(context).push(PageRouteBuilder(pageBuilder: (context, animation, secondaryAnimation) {return FadeTransition(opacity: animation, child: const RouterPageA());}));

pageBuilder + transitionsBuilder 实现过渡动画

Navigator.of(context).push(PageRouteBuilder(pageBuilder: (context, animation, secondaryAnimation) =>const RouterPageA(),transitionsBuilder:(context, animation, secondaryAnimation, child) {//动画的起始位置，轴y方向屏幕下侧偏移起点var start = const Offset(0, 1);//动画的结束位置，0表示没有偏移var end = Offset.zero;//动画曲线，easeInOut 表示开始慢，中间加速，结束慢var curve = Curves.easeInOut;// 创建一个从begin到end的补间动画，.chain 表示与曲线结合var tween = Tween(begin: start, end: end).chain(CurveTween(curve: curve));// SlideTransition 是一个动画Widgetreturn SlideTransition(position: animation.drive(tween), child: child);}));

 静态路由

静态路由需要提前注册，首先给每个路由定义一个名称，通过这个名称来导航到对应的路由。

在应用根级别 (MaterialApp 或者 CupertinoApp ) 中定义路由，使用routes参数将路由名称映射到对应的Widget。

不带参数与返回值案例

Navigator.of(context).pushNamed("/dart_test_router1");
import 'package:flutter/material.dart';import 'dart_test_router1.dart';class TestStaticRouterPage extends StatelessWidget {const TestStaticRouterPage({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(title: "Test Router Demo",theme: ThemeData(useMaterial3: false,primarySwatch: Colors.blue,textButtonTheme: const TextButtonThemeData(style: ButtonStyle(splashFactory: NoSplash.splashFactory),),),home: const RealTestStaticRouterPage(),routes: {//  "/": (context) => const RealTestStaticRouterPage(),"/dart_test_router1": (context) => const RouterPageA()},// initialRoute: "/",);}
}class RealTestStaticRouterPage extends StatelessWidget {const RealTestStaticRouterPage({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("TEST STATIC ROUTER PAGE"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("Test Static Router Page"),ElevatedButton(onPressed: () {Navigator.of(context).pushNamed("/dart_test_router1");},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)],),),);}

带参数与返回值

import 'package:flutter/material.dart';import 'dart_test_router1.dart';
import 'dart_test_router3.dart';class TestStaticRouterPage extends StatelessWidget {const TestStaticRouterPage({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(title: "Test Router Demo",theme: ThemeData(useMaterial3: false,primarySwatch: Colors.blue,textButtonTheme: const TextButtonThemeData(// 鍘绘帀 TextButton 鐨勬按娉㈢汗鏁堟灉style: ButtonStyle(splashFactory: NoSplash.splashFactory),),),home: const RealTestStaticRouterPage(),routes: {//  "/": (context) => const RealTestStaticRouterPage(),"/dart_test_router1": (context) => const RouterPageA(),"/dart_test_router3": (context) => const RouterPage3()},// initialRoute: "/",);}
}class RealTestStaticRouterPage extends StatelessWidget {const RealTestStaticRouterPage({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("TEST STATIC ROUTER PAGE"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("Test Static Router Page"),ElevatedButton(onPressed: () async {var result = await Navigator.of(context).pushNamed("/dart_test_router3",arguments: {"title": "Hello"});print(result);},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)],),),);}

import 'package:flutter/material.dart';class RouterPage3 extends StatefulWidget {const RouterPage3({super.key});@overrideState<StatefulWidget> createState() {return _RouterPage3State();}
}class _RouterPage3State extends State<RouterPage3> {@overrideWidget build(BuildContext context) {var args =ModalRoute.of(context)?.settings.arguments as Map<String, dynamic>?;final title = args?['title'] ?? "DEFAULT TITLE";return Scaffold(appBar: AppBar(title: Text("RouterPageA"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[Text("GET TITLE===========銆?title"),ElevatedButton(onPressed: () {Navigator.pop(context, "I went from RouterPage3");},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)],),),);}
}

 

2024-09-12 10:01:46.569 25438-25629 flutter  I  I went from RouterPage3

路由操作

路由替换

像登录页跳首页的场景，我们希望页面跳转成功后，回到上上个页面。我们可以通过pushReplacement、pushReplacementNamed实现。

API一：动态路由替换

Navigator.of(context).pushReplacement(MaterialPageRoute(builder: (context) => RouterPageA()));

API二：静态路由替换

         var result = await Navigator.of(context).pushReplacementNamed("/dart_test_router3",arguments: {"title": "Hello"});

新路由入栈+移除之前的路由，直到条件满足

pushAndRemoveUntil 将给定路由推送给Navigator，删除先前的路由，直到该函数的参数predicate返回true为才停止。

import 'package:flutter/material.dart';import 'dart_test_router1.dart';
import 'dart_test_router3.dart';class TestRouterPage4 extends StatelessWidget {const TestRouterPage4({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(title: "Test pushAndRemoveUntil",theme: ThemeData(useMaterial3: false,primarySwatch: Colors.blue,textButtonTheme: const TextButtonThemeData(style: ButtonStyle(splashFactory: NoSplash.splashFactory),)),home: const RealTestRouterPage4(),);}
}class RealTestRouterPage4 extends StatelessWidget {const RealTestRouterPage4({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("Test pushAndRemoveUntil"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("test pushAndRemoveUntil"),ElevatedButton(onPressed: () {Navigator.pushAndRemoveUntil(context,MaterialPageRoute(builder: (context) => RouterPageA()),(Route<dynamic> route) => route.isFirst);},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)]),),);}
}

这个方式是跳转到某个页面，然后移除路由直到...为止

路由出栈，直到条件满足

在flutter 路由跳转中，我们想要回到特定的一个页面 比如：从 A -> B-> C ->D，我们向从 D页面 pop至 B 页面。我们可以使用 popUtil方法回到 B 页面。

popUntil 反复执行pop 直到该函数的参数predicate返回true为止。

import 'package:flutter/material.dart';import 'dart_test_router6.dart';class TestRouterPage5 extends StatelessWidget {const TestRouterPage5({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(title: "Test popUntil TestRouterPage5",theme: ThemeData(useMaterial3: false,primarySwatch: Colors.blue,textButtonTheme: const TextButtonThemeData(style: ButtonStyle(splashFactory: NoSplash.splashFactory),)),home: const RealTestRouterPage5(),);}
}class RealTestRouterPage5 extends StatelessWidget {const RealTestRouterPage5({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("Test popUntil TestRouterPage5"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("test popUntil TestRouterPage5"),ElevatedButton(onPressed: () {Navigator.push(context,MaterialPageRoute(builder: (context) => TestRouterPage6()));},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)]),),);}
}

import 'package:flutter/material.dart';import 'dart_test_router7.dart';class TestRouterPage6 extends StatelessWidget {const TestRouterPage6({super.key});@overrideWidget build(BuildContext context) {return RealTestRouterPage6();}
}class RealTestRouterPage6 extends StatelessWidget {const RealTestRouterPage6({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("Test popUntil TestRouterPage6"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("test popUntil TestRouterPage6"),ElevatedButton(onPressed: () {Navigator.push(context,MaterialPageRoute(builder: (context) => TestRouterPage7()));},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)]),),);}
}

import 'package:flutter/material.dart';class TestRouterPage7 extends StatelessWidget {const TestRouterPage7({super.key});@overrideWidget build(BuildContext context) {return RealTestRouterPage7();}
}class RealTestRouterPage7 extends StatelessWidget {const RealTestRouterPage7({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("Test popUntil TestRouterPage7"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("test popUntil TestRouterPage7"),ElevatedButton(onPressed: () {Navigator.of(context).popUntil((Route<dynamic> route) => route.isFirst);},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)]),),);}
}

上面的代码中调用Navigator.of(context)
                      .popUntil((Route<dynamic> route) => route.isFirst);直接回到了 TestRouterPage5。

 

删除指定路由
 

获得当前路由
 

ModalRoute.of(context);
 

 移除指定路由
 


if (route != null) {Navigator.of(context).removeRoute(route);
}

 

移除指定路由下方的单个路由
 

if (route != null) {Navigator.of(context).removeRouteBelow(route);
}
 

 

页面传参与数据回传
 

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
import 'package:gsy_flutter_demo/widget/dart_test_router2.dart';import 'dart_test_router1.dart';class TestRouterPage extends StatelessWidget {const TestRouterPage({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("Test Navigator"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[const Text("Test MaterialPageRoute"),ElevatedButton(onPressed: () async {String backContent = await Navigator.of(context).push(MaterialPageRoute(builder: (context) => RouterPage2(title: "Custom Title")));print(backContent);},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)],),),);}
}

 

import 'package:flutter/material.dart';class RouterPage2 extends StatefulWidget {final String title;const RouterPage2({super.key, required this.title});@overrideState<StatefulWidget> createState() {return _RouterPage2State();}
}class _RouterPage2State extends State<RouterPage2> {@overrideWidget build(BuildContext context) {var widgitTitle = widget.title;return Scaffold(appBar: AppBar(title: Text("RouterPageA"),),body: Container(alignment: Alignment.center,margin: const EdgeInsets.all(10),child: Column(crossAxisAlignment: CrossAxisAlignment.center,mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[Text("GET TITLE===========銆?widgitTitle"),ElevatedButton(onPressed: () {Navigator.pop(context, "I went from RouterPageA");},child: Text("Click ElevatedButton"),style: ElevatedButton.styleFrom(backgroundColor: Colors.blue,foregroundColor: Colors.white,elevation: 10,minimumSize: Size(double.infinity, 50),shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10))),)],),),);}
}

 

 

2024-09-11 14:51:16.211 24765-24840 flutter I  I went from RouterPageA
 

 


  
 

 

Navigator  的工作流程
 

Navigator  的核心是对路由栈的管理。当你调用 Navigator.push 时，一个新的路由被创建并推入栈顶；当你调用 Navigator.pop 时，栈顶的路由被移除。
 

  const Navigator({super.key,this.pages = const <Page<dynamic>>[],this.onPopPage,this.initialRoute,this.onGenerateInitialRoutes = Navigator.defaultGenerateInitialRoutes,this.onGenerateRoute,this.onUnknownRoute,this.transitionDelegate = const DefaultTransitionDelegate<dynamic>(),this.reportsRouteUpdateToEngine = false,this.clipBehavior = Clip.hardEdge,this.observers = const <NavigatorObserver>[],this.requestFocus = true,this.restorationScopeId,this.routeTraversalEdgeBehavior = kDefaultRouteTraversalEdgeBehavior,});
 

 

Navigator.push 
 

#Navigator.push
 

  @optionalTypeArgsstatic Future<T?> push<T extends Object?>(BuildContext context, Route<T> route) {return Navigator.of(context).push(route);}

 

Navigator.push 调用Navigator.of(context).push(route)，内部 调用NavigatorState 的 push 方法：
 

 

  @optionalTypeArgsFuture<T?> push<T extends Object?>(Route<T> route) {_pushEntry(_RouteEntry(route, pageBased: false, initialState: _RouteLifecycle.push));return route.popped;}

 

 #NavigatorState
 

  void _pushEntry(_RouteEntry entry) {assert(!_debugLocked);assert(() {_debugLocked = true;return true;}());assert(entry.route._navigator == null);assert(entry.currentState == _RouteLifecycle.push);_history.add(entry);_flushHistoryUpdates();assert(() {_debugLocked = false;return true;}());_afterNavigation(entry.route);}
 

这里发生了一系列操作：
 

  • _history.add(route) ： 将 新路由 添加到 路由栈 中。
  • route.install() ： 安装路由，将页面挂载到 widget 树上。
  • route.didPush() ： 通知 路由 已经被推入 栈顶 。
  • _cancelActivePointers() ： 取消所有正在进行的触摸事件，防止发生意外事件。
  • route.didChange() ： 通知 路由 状态发生变化。
 

push 方法返回一个 Future，该 Future 会在路由完成push操作时完成。
 

 

Navigator.pop
 

#Navigator.pop 
 

 Navigator.of(context).pop();
 

  @optionalTypeArgsvoid pop<T extends Object?>([ T? result ]) {assert(!_debugLocked);assert(() {_debugLocked = true;return true;}());final _RouteEntry entry = _history.lastWhere(_RouteEntry.isPresentPredicate);if (entry.pageBased) {if (widget.onPopPage!(entry.route, result) && entry.currentState == _RouteLifecycle.idle) {// The entry may have been disposed if the pop finishes synchronously.assert(entry.route._popCompleter.isCompleted);entry.currentState = _RouteLifecycle.pop;}entry.route.onPopInvoked(true);} else {entry.pop<T>(result);assert (entry.currentState == _RouteLifecycle.pop);}if (entry.currentState == _RouteLifecycle.pop) {_flushHistoryUpdates(rearrangeOverlay: false);}assert(entry.currentState == _RouteLifecycle.idle || entry.route._popCompleter.isCompleted);assert(() {_debugLocked = false;return true;}());_afterNavigation(entry.route);}
 

  • history.lastWhere：找到最后一个处于 “存在”状态 的路由条目。
  • entry.pageBased：路由是否是基于页面的。
  • widget.onPopPage：执行页面pop操作。
  • entry.route.onPopInvoked(true)：通知路由pop操作被调用。
  • entry.pop<T>(result)：直接调用pop。
  • _afterNavigation(entry.route)：导航完成后回调。
 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 















相关文章：
















Flutter路由




路由作为一种页面切换的能力&#xff0c;非常重要。Flutter 中路由管理有几个重要的点。 
Navigator 1.0&#xff1a;Flutter 早期路由系统&#xff0c;侧重于移动端 &#xff0c;命令式编程风格&#xff0c;使用 Navigator.push() 和 Navigator.pop() 等方法来管理路由栈。 
N…...






编程日记
2024/10/3 4:36:30



















css预处理器less




CSS预处理器Less教程 
CSS预处理器是一种扩展CSS功能的工具&#xff0c;它允许开发者使用变量、嵌套规则、混合&#xff08;Mixins&#xff09;、函数等高级特性&#xff0c;使CSS代码更加灵活、易于维护和扩展。Less是其中一种流行的CSS预处理器&#xff0c;它使用JavaScript编…...






编程日记
2024/10/3 4:35:29



















WEB服务器——Tomcat




服务器是可以使用java完成编写&#xff0c;是可以接受页面发送的请求和响应数据给前端浏览器的&#xff0c;而在开发中真正用到的Web服务器&#xff0c;我们不会自己写的&#xff0c;都是使用目前比较流行的web服务器。 如&#xff1a;Tomcat 
1. 简介 
Tomcat 是一个开源的轻量…...






编程日记
2024/10/3 4:34:28



















C++ STL（3）list




文章目录 一、list 详解1、内存管理2、常用操作3、迭代器erase()删除list中的元素 前言&#xff1a; C 标准模板库&#xff08;STL&#xff09;中的 list 容器是一种双向链表数据结构&#xff0c;它允许在常数时间内进行插入和删除操作&#xff0c;而无需重新分配整个容器或移动…...






编程日记
2024/10/3 4:33:27



















Ubuntu下安装Zookeeper集群




Zookeeper集群是一个开源的分布式协调服务系统&#xff0c;它由Apache软件基金会维护&#xff0c;旨在为分布式应用提供一致性和可靠性的服务。 
在Zookeeper集群中&#xff0c;服务器可以扮演三种角色——领导者&#xff08;Leader&#xff09;、跟随者&#xff08;Follower&a…...






编程日记
2024/10/3 4:31:25



















模版and初识vector




一、引言 
在C语言中&#xff0c;不论是数组&#xff0c;还是结构体定义的数组&#xff0c;功能都比较欠缺&#xff0c;不是单纯的添加几个变量就能够解决的。缺少增删查改的功能&#xff0c;为了解决这个问题&#xff0c;C决定填上C语言这个坑&#xff0c;但是填过坑的人都知道…...






编程日记
2024/10/3 4:29:23



















网站开发基础：HTML、CSS




前端开发主要使用的技术如 HTML、CSS 和 JavaScript 等。 
简单制作一个网页 <!DOCTYPE html>
<html lang"en">
<head><meta charset"UTF-8"><title>柒毓同学网站的首页</title><style>.c1{border: solid 1px g…...






编程日记
2024/10/3 4:28:22



















IP协议讲解




IP协议 
IP协议的本质&#xff1a;提供一种能力&#xff0c;将数据跨网络从A主机传输到B主机 4位版本号(version): 指定IP协议的版本, 对于IPv4来说, 就是4. 
4位头部长度(header length): IP头部的长度是多少个32bit, 也就是 length * 4 的字节数. 4bit表示最大 的数字是15, 因…...






编程日记
2024/10/3 4:26:19



















SpringMVC4-SpringMVC获取请求参数




目录 
通过ServletAPI获取&#xff08;不常用&#xff09; 
通过控制器方法的形参获取请求参数 
RequestParam 
RequestHeader 
CookieValue 
通过POJO获取请求参数 
解决获取请求参数的乱码问题 test_param.html&#xff1a; 
<!DOCTYPE html>
<html lang"en&qu…...






编程日记
2024/10/3 4:25:18



















【C++】C++基础




目录 一. C关键字(C98) 
二、C的第一个程序 
三、命名空间 
3.1.namespace的价值 
3.2.namespace的定义 
3.2.命名空间使用 
总结&#xff1a;在项目当中第一、第二种方法搭配使用&#xff0c;第三种冲突风险非常大&#xff0c;仅适合练习使用。 
四、C输入&输出 
五、缺省…...






编程日记
2024/10/3 4:22:15



















自动化运维工具 Ansible




Ansible 基础 Ansible 介绍 
Ansible 是一个自动化运维工具&#xff0c;基于Python开发&#xff0c;集合了众多运维工具&#xff08;puppet、cfengine、chef、 func、fabric&#xff09;的优点&#xff0c;实现了批量系统配置、批量程序部署、批量运行命令等功能。 
Ansible 的…...






编程日记
2024/10/3 4:21:14



















深度学习：GAN图像生成




GAN的诞生背景 
诞生&#xff1a; 
2014年由Ian Goodfellow提出 
创新性&#xff1a; 
无监督学习&#xff1a;GAN 提供了一种新的方法来进行无监督学习&#xff0c;即不需要对训练数据进行标注就可以学习到数据的潜在分布。对抗训练&#xff1a;通过引入对抗机制&#xff0c;G…...






编程日记
2024/10/3 4:20:12



















django基于python的房价分析可视化系统的设计与开发 h1y0i




目录 项目介绍技术栈具体实现截图Scrapy爬虫框架关键技术和使用的工具环境等的说明解决的思路开发流程爬虫核心代码展示系统设计论文书写大纲详细视频演示源码获取 项目介绍 
大数据分析是现下比较热门的词汇&#xff0c;通过分析之后可以得到更多深入且有价值的信息。现实的科…...






编程日记
2024/10/3 4:18:10



















Labview helper




IMAQ Advanced Setup Learn Geometric Pattern 2 VI 
参数说明Curve Extraction Mode (0)指定VI如何识别图像中的曲线。如果您希望VI不对图像中对象的均匀性或图像背景做出任何假设&#xff0c;请将此选项设置为正常。如果您希望VI假定图像中的对象或图像背景由均匀的像素值组成…...






编程日记
2024/10/3 4:17:10



















《安富莱嵌入式周报》第343期：雷电USB4开源示波器正式发布，卓越的模拟前端低噪便携示波器，自带100W电源的便携智能烙铁，NASA航空航天锂电池设计




周报汇总地址&#xff1a;嵌入式周报 - uCOS & uCGUI & emWin & embOS & TouchGFX & ThreadX - 硬汉嵌入式论坛 - Powered by Discuz! 更新一期视频教程 
【授人以渔】CMSIS-RTOS V2封装层专题视频&#xff0c;一期视频将常用配置和用法梳理清楚&#xff0…...






编程日记
2024/10/3 4:16:09



















如何用JavaScript编写一个简单的计数器




在网页开发中&#xff0c;计数器是一种常见的功能&#xff0c;它可以帮助我们记录点击次数、显示时间等。下面我将介绍如何在HTML页面中使用JavaScript实现一个基本的计数器。如图&#xff1a; 1、 创建HTML结构 
首先&#xff0c;我们需要创建一个基础的HTML结构来容纳我们的计…...






编程日记
2024/10/3 4:14:04



















uniapp中实现评分组件，多用于购买商品后，对商品进行评价等场景




前言 
uni-rate是uniapp框架中提供的一个评分组件。它可以用于用户评价、打分等场景。uni-rate组件可以根据设定的星星总数&#xff0c;展示用户评分的效果&#xff0c;用户可以通过点击星星或滑动星星的方式进行评分。同时&#xff0c;uni-rate组件也支持自定义星星图标、星星…...






编程日记
2024/10/3 4:06:55



















算法笔记（三）——前缀和算法




算法笔记&#xff08;三&#xff09;——前缀和算法 文章目录 算法笔记&#xff08;三&#xff09;——前缀和算法一维前缀和二维前缀和寻找数组的中心下标除自身以外数组的乘积和为 K 的子数组和可被 K 整除的子数组连续数组矩阵区域和 前缀和算法是一种用空间换时间的算法&am…...






编程日记
2024/10/3 4:04:53



















Nginx技术深度解析与实战应用




Nginx技术深度解析与实战应用 
Nginx是一款轻量级、高性能的Web服务器、反向代理服务器及电子邮件&#xff08;IMAP/POP3&#xff09;代理服务器&#xff0c;由俄罗斯的程序设计师Igor 
Sysoev开发。Nginx以其内存占用少、启动迅速、高并发能力强等特性&#xff0c;在互联网项目…...






编程日记
2024/10/3 4:03:52



















Maven Surefire Plugin




Maven Surefire Plugin 最新版本新特性详解 
Maven Surefire Plugin 是用于运行单元测试和集成测试的重要工具&#xff0c;支持 JUnit、TestNG 等测试框架。插件的新版本引入了许多新特性和配置选项&#xff0c;这些功能提升了测试执行的性能、灵活性和并发能力。在本节中&…...






编程日记
2024/10/3 4:01:50





















Day131 | 灵神 | 回溯算法 | 子集型 子集




Day131 | 灵神 | 回溯算法 | 子集型 子集 
78.子集 
78. 子集 - 力扣&#xff08;LeetCode&#xff09; 
思路&#xff1a; 
笔者写过很多次这道题了&#xff0c;不想写题解了&#xff0c;大家看灵神讲解吧 
回溯算法套路①子集型回溯【基础算法精讲 14】_哔哩哔哩_bilibili 
完…...






编程新知
2025/9/6 15:50:17



















【SpringBoot】100、SpringBoot中使用自定义注解+AOP实现参数自动解密




在实际项目中，用户注册、登录、修改密码等操作，都涉及到参数传输安全问题。所以我们需要在前端对账户、密码等敏感信息加密传输，在后端接收到数据后能自动解密。 
1、引入依赖 
<dependency><groupId>org.springframework.boot</groupId><artifactId...






编程新知
2025/6/17 4:52:56



















电脑插入多块移动硬盘后经常出现卡顿和蓝屏




当电脑在插入多块移动硬盘后频繁出现卡顿和蓝屏问题时&#xff0c;可能涉及硬件资源冲突、驱动兼容性、供电不足或系统设置等多方面原因。以下是逐步排查和解决方案&#xff1a; 1. 检查电源供电问题 
问题原因&#xff1a;多块移动硬盘同时运行可能导致USB接口供电不足&#x…...






编程新知
2025/8/2 6:48:59



















第一篇：Agent2Agent (A2A) 协议——协作式人工智能的黎明




AI 领域的快速发展正在催生一个新时代&#xff0c;智能代理&#xff08;agents&#xff09;不再是孤立的个体&#xff0c;而是能够像一个数字团队一样协作。然而&#xff0c;当前 AI 生态系统的碎片化阻碍了这一愿景的实现&#xff0c;导致了“AI 巴别塔问题”——不同代理之间…...






编程新知
2025/8/19 20:28:20



















【服务器压力测试】本地PC电脑作为服务器运行时出现卡顿和资源紧张（Windows/Linux）




要让本地PC电脑作为服务器运行时出现卡顿和资源紧张的情况&#xff0c;可以通过以下几种方式模拟或触发&#xff1a; 
1. 增加CPU负载 
运行大量计算密集型任务&#xff0c;例如&#xff1a; 使用多线程循环执行复杂计算&#xff08;如数学运算、加密解密等&#xff09;。运行图…...






编程新知
2025/8/22 22:34:43



















【Java_EE】Spring MVC




目录 Spring Web MVC 
​编辑注解 
RestController 
RequestMapping 
RequestParam 
RequestParam 
RequestBody 
PathVariable 
RequestPart 
参数传递 
注意事项 
​编辑参数重命名 
RequestParam 
​编辑​编辑传递集合 
RequestParam 
传递JSON数据 
​编辑RequestBody 
​…...






编程新知
2025/9/3 18:59:01



















AI编程--插件对比分析：CodeRider、GitHub Copilot及其他




AI编程插件对比分析&#xff1a;CodeRider、GitHub Copilot及其他 
随着人工智能技术的快速发展&#xff0c;AI编程插件已成为提升开发者生产力的重要工具。CodeRider和GitHub Copilot作为市场上的领先者&#xff0c;分别以其独特的特性和生态系统吸引了大量开发者。本文将从功…...






编程新知
2025/7/6 18:33:10



















[大语言模型]在个人电脑上部署ollama 并进行管理,最后配置AI程序开发助手.




ollama官网: 
下载 
https://ollama.com/ 
安装 查看可以使用的模型 
https://ollama.com/search  
例如 
https://ollama.com/library/deepseek-r1/tags  
# deepseek-r1:7bollama pull deepseek-r1:7b改token数量为409622  16384 
ollama命令说明 
ollama serve #&#xff1a…...






编程新知
2025/9/4 16:15:51



















PHP 8.5 即将发布：管道操作符、强力调试




前不久&#xff0c;PHP宣布了即将在 2025 年 11 月 20 日 正式发布的 PHP 8.5&#xff01;作为 PHP 语言的又一次重要迭代&#xff0c;PHP 8.5 承诺带来一系列旨在提升代码可读性、健壮性以及开发者效率的改进。而更令人兴奋的是&#xff0c;借助强大的本地开发环境 ServBay&am…...






编程新知
2025/9/13 8:26:16



















算法打卡第18天




从中序与后序遍历序列构造二叉树 
(力扣106题) 
给定两个整数数组 inorder 和 postorder &#xff0c;其中 inorder 是二叉树的中序遍历&#xff0c; postorder 是同一棵树的后序遍历&#xff0c;请你构造并返回这颗 二叉树 。 
示例 1: 输入&#xff1a;inorder  [9,3,15,20,7…...






编程新知
2025/9/9 10:06:46