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

React 更新state中的对象

更新 state 中的对象

state 中可以保存任意类型的 JavaScript 值,包括对象。但是,你不应该直接修改存放在 React state 中的对象。相反,当你想要更新一个对象时,你需要创建一个新的对象(或者将其拷贝一份),然后将 state 更新为此对象。

文章及例子是参考React官方文档教程,开发环境:React+ts+antd

学习内容:

  • 如何正确地更新 React state 中的对象
  • 如何在不产生 mutation 的情况下更新一个嵌套对象
  • 什么是不可变性(immutability),以及如何不破坏它
  • 如何使用 Immer 使复制对象不那么繁琐

什么是 mutation?

你可以在 state 中存放任意类型的 JavaScript 值。

const [x, setX] = useState(0);
setX(5);

state x 从 0 变为 5,但是数字 0 本身并没有发生改变。在 JavaScript 中,无法对内置的原始值,如数字、字符串和布尔值,进行任何更改。

现在考虑 state 中存放对象的情况:

const [position, setPosition] = useState({ x: 0, y: 0 });

从技术上来讲,可以改变对象自身的内容。当你这样做时,就制造了一个 mutation:

position.x = 5;

然而,虽然严格来说 React state 中存放的对象是可变的,但你应该像处理数字、布尔值、字符串一样将它们视为不可变的。因此你应该替换它们的值,而不是对它们进行修改。

将 state 视为只读的

换句话说,你应该 把所有存放在 state 中的 JavaScript 对象都视为只读的。

在下面的例子中,我们用一个存放在 state 中的对象来表示指针当前的位置。当你在预览区触摸或移动光标时,红点会跟随着你的指针移动:

import React from 'react';
import {useState} from "react";const App: React.FC = () => {const [position, setPosition] = useState({x: 0,y: 0});return (<divonPointerMove={e => {setPosition({x: e.clientX,y: e.clientY});}}style={{position: 'relative',width: '100vw',height: '100vh',}}><div style={{position: 'absolute',backgroundColor: 'red',borderRadius: '50%',transform: `translate(${position.x}px, ${position.y}px)`,left: -10,top: -10,width: 20,height: 20,}}/></div>);
};export default App;

使用展开语法复制对象

在之前的例子中,始终会根据当前指针的位置创建出一个新的 position 对象。但是通常,你会希望把 现有 数据作为你所创建的新对象的一部分。例如,你可能只想要更新表单中的一个字段,其他的字段仍然使用之前的值。

下面的代码中,输入框并不会正常运行,因为 onChange 直接修改了 state :

import React from 'react';
import {useState} from "react";const App: React.FC = () => {const [person, setPerson] = useState({firstName: 'Barbara',lastName: 'Hepworth',email: 'bhepworth@sculpture.com'});const handleFirstNameChange=(e:any)=> {person.firstName = e.target.value;}const handleLastNameChange=(e:any)=> {person.lastName = e.target.value;}const handleEmailChange=(e:any)=> {person.email = e.target.value;}return (<><label>First name:<inputvalue={person.firstName}onChange={handleFirstNameChange}/></label><label>Last name:<inputvalue={person.lastName}onChange={handleLastNameChange}/></label><label>Email:<inputvalue={person.email}onChange={handleEmailChange}/></label><p>{person.firstName}{' '}{person.lastName}{' '}({person.email})</p></>);
};export default App;

在这里插入图片描述
此时输入框是不会正常运行的.
例如,下面这行代码修改了上一次渲染中的 state:

person.firstName = e.target.value;

想要实现你的需求,最可靠的办法就是创建一个新的对象并将它传递给 setPerson。但是在这里,你还需要 把当前的数据复制到新对象中,因为你只改变了其中一个字段:

setPerson({firstName: e.target.value, // 从 input 中获取新的 first namelastName: person.lastName,email: person.email
});

你可以使用 … 对象展开 语法,这样你就不需要单独复制每个属性。

setPerson({...person, // 复制上一个 person 中的所有字段firstName: e.target.value // 但是覆盖 firstName 字段 
});

在这里插入图片描述
改变输入后

在这里插入图片描述
请注意 … 展开语法本质是是“浅拷贝”——它只会复制一层。这使得它的执行速度很快,但是也意味着当你想要更新一个嵌套属性时,你必须得多次使用展开语法。

更新一个嵌套对象

考虑下面这种结构的嵌套对象:

const [person, setPerson] = useState({name: 'Niki de Saint Phalle',artwork: {title: 'Blue Nana',city: 'Hamburg',image: 'https://i.imgur.com/Sd1AgUOm.jpg',}
});

如果你想要更新 person.artwork.city 的值,用 mutation 来实现的方法非常容易理解:

person.artwork.city = 'New Delhi';

但是在 React 中,你需要将 state 视为不可变的!为了修改 city 的值,你首先需要创建一个新的 artwork 对象(其中预先填充了上一个 artwork 对象中的数据),然后创建一个新的 person 对象,并使得其中的 artwork 属性指向新创建的 artwork 对象:

const nextArtwork = { ...person.artwork, city: 'New Delhi' };
const nextPerson = { ...person, artwork: nextArtwork };
setPerson(nextPerson);

或者,写成一个函数调用:

setPerson({...person, // 复制其它字段的数据 artwork: { // 替换 artwork 字段 ...person.artwork, // 复制之前 person.artwork 中的数据city: 'New Delhi' // 但是将 city 的值替换为 New Delhi!}
});

这虽然看起来有点冗长,但对于很多情况都能有效地解决问题

使用 Immer 编写简洁的更新逻辑

如果你的 state 有多层的嵌套,你或许应该考虑 将其扁平化。但是,如果你不想改变 state 的数据结构,你可能更喜欢用一种更便捷的方式来实现嵌套展开的效果。Immer 是一个非常流行的库,它可以让你使用简便但可以直接修改的语法编写代码,并会帮你处理好复制的过程。通过使用 Immer,你写出的代码看起来就像是你“打破了规则”而直接修改了对象:

updatePerson(draft => {draft.artwork.city = 'Lagos';
});

但是不同于一般的 mutation,它并不会覆盖之前的 state!

Immer 是如何运行的?

由 Immer 提供的 draft 是一种特殊类型的对象,被称为 Proxy,它会记录你用它所进行的操作。这就是你能够随心所欲地直接修改对象的原因所在!从原理上说,Immer 会弄清楚 draft 对象的哪些部分被改变了,并会依照你的修改创建出一个全新的对象。

尝试使用 Immer:

  1. 运行 npm install use-immer 添加 Immer 依赖
  2. 用 import { useImmer } from ‘use-immer’ 替换掉 import { useState } from ‘react’

下面我们把上面的例子用 Immer 实现一下:

import React from 'react';
import { useImmer } from 'use-immer';const App: React.FC = () => {const [person, updatePerson] = useImmer({name: 'Niki de Saint Phalle',artwork: {title: 'Blue Nana',city: 'Hamburg',}});const handleNameChange=(e:any)=> {updatePerson(draft => {draft.name = e.target.value;});}const handleTitleChange=(e:any)=> {updatePerson(draft => {draft.artwork.title = e.target.value;});}const handleCityChange=(e:any)=>{updatePerson(draft => {draft.artwork.city = e.target.value;});}return (<><label>Name:<inputvalue={person.name}onChange={handleNameChange}/></label><br/><label>Title:<inputvalue={person.artwork.title}onChange={handleTitleChange}/></label><br/><label>City:<inputvalue={person.artwork.city}onChange={handleCityChange}/></label><p><i>{person.artwork.title}</i>{' by '}{person.name}<br/>(located in {person.artwork.city})</p></>);
};export default App;

在这里插入图片描述
改变输入内容:
在这里插入图片描述

可以看到,事件处理函数变得更简洁了。你可以随意在一个组件中同时使用 useState 和 useImmer。如果你想要写出更简洁的更新处理函数,Immer 会是一个不错的选择,尤其是当你的 state 中有嵌套,并且复制对象会带来重复的代码时。

为什么在 React 中不推荐直接修改 state?

有以下几个原因:

  • 调试:如果你使用 console.log 并且不直接修改 state,你之前日志中的 state 的值就不会被新的 state 变化所影响。这样你就可以清楚地看到两次渲染之间 state 的值发生了什么变化
  • 优化:React 常见的 优化策略 依赖于如果之前的 props 或者 state 的值和下一次相同就跳过渲染。如果你从未直接修改 state ,那么你就可以很快看到 state 是否发生了变化。如果 prevObj === obj,那么你就可以肯定这个对象内部并没有发生改变。
  • 新功能:我们正在构建的 React 的新功能依赖于 state 被 像快照一样看待 的理念。如果你直接修改 state 的历史版本,可能会影响你使用这些新功能。
  • 需求变更:有些应用功能在不出现任何修改的情况下会更容易实现,比如实现撤销/恢复、展示修改历史,或是允许用户把表单重置成某个之前的值。这是因为你可以把 state 之前的拷贝保存到内存中,并适时对其进行再次使用。如果一开始就用了直接修改 state 的方式,那么后面要实现这样的功能就会变得非常困难。
  • 更简单的实现:React 并不依赖于 mutation ,所以你不需要对对象进行任何特殊操作。它不需要像很多“响应式”的解决方案一样去劫持对象的属性、总是用代理把对象包裹起来,或者在初始化时做其他工作。这也是 React 允许你把任何对象存放在 state 中——不管对象有多大——而不会造成有任何额外的性能或正确性问题的原因。

摘要

  • 将 React 中所有的 state 都视为不可直接修改的。
  • 当你在 state 中存放对象时,直接修改对象并不会触发重渲染,并会改变前一次渲染“快照”中 state 的值。
  • 不要直接修改一个对象,而要为它创建一个 新 版本,并通过把 state 设置成这个新版本来触发重新渲染。
  • 你可以使用这样的 {…obj, something: ‘newValue’} 对象展开语法来创建对象的拷贝。
  • 对象的展开语法是浅层的:它的复制深度只有一层。
  • 想要更新嵌套对象,你需要从你更新的位置开始自底向上为每一层都创建新的拷贝。
  • 想要减少重复的拷贝代码,可以使用 Immer。

相关文章:

React 更新state中的对象

更新 state 中的对象 state 中可以保存任意类型的 JavaScript 值&#xff0c;包括对象。但是&#xff0c;你不应该直接修改存放在 React state 中的对象。相反&#xff0c;当你想要更新一个对象时&#xff0c;你需要创建一个新的对象&#xff08;或者将其拷贝一份&#xff09;…...

祁连山国家公园shp格式数据

地理位置&#xff1a;祁连山国家公园位于中国西北部&#xff0c;横跨甘肃省与青海省交界处&#xff0c;主体处于青藏高原东北边缘。总面积约5.02万平方公里&#xff0c;是中国首批设立的10个国家公园之一。 设立背景 试点启动&#xff1a;2017年&#xff0c;祁连山国家公园体制…...

电梯设备与电源滤波器:现代建筑中的安全守护者与电力净化师

在现代都市的钢铁森林中&#xff0c;电梯作为垂直交通的动脉&#xff0c;承载着无数人的日常出行。与此同时&#xff0c;在电气系统的隐秘角落&#xff0c;电源滤波器则默默扮演着“电力净化师”的角色&#xff0c;保障着各类电子设备的稳定运行。电梯设备与电源滤波器&#xf…...

Qt样式表(窗口、按钮之类,有图片和代码详细注释)

Qt样式表 1、前言2、QWdiget窗口添加背景图片2.1使用Frame解决 3、主题1&#xff08;黑色背景发光边框冷色调&#xff09;3.1 QWidget3.2 QPushButton3.3QLineEdit3.4 QTextEdit 4、主题二&#xff08;极简冰川蓝&#xff09;4.1QWidget4.2 QLineEdit4.3QTextEdit4.4QPushButto…...

在Ubuntu下进行单片机开发是否需要关闭Secure Boot

1. Secure Boot的作用 功能&#xff1a;Secure Boot是UEFI的安全功能&#xff0c;旨在阻止未经验证的驱动或操作系统启动&#xff0c;防止恶意软件篡改引导过程。 影响范围&#xff1a;它主要限制的是操作系统启动阶段加载的内核级驱动&#xff08;如显卡驱动、虚拟化模块&…...

【Python爬虫】简单案例介绍4

本文继续接着我的上一篇博客【Python爬虫】简单案例介绍3-CSDN博客 目录 3.4 完整代码 3.4 完整代码 此小节给出上述案例的完整代码&#xff0c; # encodingutf-8 import re, json, requests, xlwt, csv import pandas as pd from lxml import etree from bs4 import Beauti…...

农民剧团的春天与改变之路

杨天义&#xff0c;男&#xff0c;1966年9月生&#xff0c;中共党员&#xff0c;江西省吉安市吉水县水南农民剧团团长。 杨天义从废品收购起家&#xff0c;凭借自身的努力和奋斗&#xff0c;自筹资金100余万元建设了水南镇的第一座影剧院&#xff0c;组建了江西省吉安市吉水县…...

网页防篡改与盗链防护:实时监控与自动化修复实践

摘要&#xff1a;针对网页内容篡改与盗链问题&#xff0c;本文基于群联AI云防护系统&#xff0c;详解如何通过哈希校验、实时监控与CDN联动实现秒级修复&#xff0c;并提供Python与AWS S3集成代码。 一、网页安全的核心需求 防篡改&#xff1a;保障页面内容完整性&#xff0c;…...

【密码学——基础理论与应用】李子臣编著 第五章 序列密码 课后习题

免责声明 这里都是自己搓或者手写的。 里面不少题目感觉有问题或者我的理解有偏颇&#xff0c;请大佬批评指正&#xff01; 不带思考抄作业的请自动退出&#xff0c;我的并非全对&#xff0c;仅仅提供思维&#xff01; 题目 逐题解析 5.1 我们先要知道三阶LFSR函数的表达式…...

【uni-app】页面跳转传参

一、EventChannel 的核心作用 替代全局事件总线 相比传统的 uni.$emit 和 uni.$on&#xff0c;EventChannel 无需手动移除监听&#xff08;如 uni.$off&#xff09;&#xff0c;避免内存泄漏风险。解决 URL 传参限制 当需要传递大量数据时&#xff0c;URL 拼接参数可能超出长度…...

【MySQL】表的增删改查

前言 前面我们对表结构做了介绍&#xff0c;本期我们对表的内容操作机增删改查进行介绍&#xff01; 目录 前言 一、insert 插入 1.1 单行数据 全列插入 1.2 多行数据 指定列插入 1.3 插入否则更新 1.4 插入否则替换 二、select 查询 2.1 select 列 2.1.1 全列查询…...

AQchat

在当前项目里&#xff0c;Handler 类主要用于处理不同类型的命令或者消息&#xff0c;下面按照不同功能模块为你详细介绍各 Handler 的作用。 命令处理 Handler&#xff08;位于 com.howcode.aqchat.handler.impl 包&#xff09; SyncRoomMembersCmdHandler&#xff1a;处理同…...

Profibus DP转ModbusTCP网关通讯案例解析

Profibus DP转ModbusTCP网关通讯案例解析 Profibus DP和Modbus TCP都是工业自动化领域中常见的通信协议&#xff0c;各自在不同的应用场景中发挥着重要作用。然而&#xff0c;由于不同设备、系统之间的兼容性需求&#xff0c;常常需要进行这两种协议的转换。本文将介绍一个典型…...

将你的 Rust + WebAssembly 项目发布到 npm

一、准备工作&#xff1a;登录 npm 在发布之前&#xff0c;你需要&#xff1a; 拥有一个 npm 账号 没有的话可前往 https://www.npmjs.com/signup 免费注册。 登录本地 npm 账户 使用 wasm-pack 自带的登录命令&#xff1a; wasm-pack login它会提示你输入 npm token&#xf…...

RGBD惯性SLAM

介绍 本篇介绍一种基于视觉光流法的RGBD惯性SLAM算法&#xff0c;该算法的前身是DEMO算法。 相对于原始版本&#xff1a; 更新了相对较老的IplImage 相关接口 加入了GTSAM后端&#xff1b;滑动窗口后端&#xff1b;3D-3Dbatch优化&#xff1b;点到面batch后端。分别对应不同的…...

linuxbash原理

3417 1647 0 04:17 ? 00:00:21 /usr/libexec/gnome-terminal-server yangang 3425 3417 0 04:17 pts/0 00:00:00 bash yangang 4524 3417 0 04:26 pts/1 00:00:00 bash 控制台创建是通过/usr/libexec/gnome-terminal-server 进行创建 rea…...

ctfshow做题笔记—栈溢出—pwn75~pwn79

目录 前言 一、pwn75(栈空间不够怎么办&#xff1f;) 二、pwn76 三、pwn77(Ez ROP or Mid ROP ?) 四、pwn79(你需要注意某些函数&#xff0c;这是解题的关键&#xff01;) 前言 嘿嘿&#xff0c;隔了一段时间没有做pwn题了&#xff08;主播脱单了&#xff09;&#xff0…...

C++ 标准库中的 <algorithm> 头文件算法总结

C 常用 <algorithm> 算法概览 C 标准库中的 <algorithm> 头文件提供了大量有用的算法&#xff0c;主要用于操作容器&#xff08;如 vector, list, array 等&#xff09;。这些算法通常通过迭代器来操作容器元素。 1. 非修改序列操作 std::all_of, std::any_of, s…...

leecode Hot100之回溯算法【C++速查】

文章目录 [46. 全排列](https://leetcode.cn/problems/permutations/)[78. 子集](https://leetcode.cn/problems/subsets/)[17. 电话号码的字母组合](https://leetcode.cn/problems/letter-combinations-of-a-phone-number/)[39. 组合总和](https://leetcode.cn/problems/combi…...

前端 main.js能做哪些事?

前端 main.js 的从入门到进阶 摘要 在前端开发中&#xff0c;main.js 文件是项目启动的关键入口&#xff0c;它承担着初始化应用、引入依赖、配置全局设置等重要职责。本文将全面介绍 main.js 的基础知识&#xff0c;包括其基本结构和作用&#xff0c;并深入探讨如何进行进阶开…...

JAVA Web_定义Servlet2_学生登录验证Servlet

题目 页面StudentLogin.html中有一HTML的表单代码如下&#xff1a; <form action"studentLogin" method"post">学生姓名&#xff1a;<input type"text" name"stuName" value""><br>登录密码&#xff1a;…...

【信息系统项目管理师】高分论文:论信息系统项目的范围管理(电网公司保供电可视化系统)

更多内容请见: 备考信息系统项目管理师-专栏介绍和目录 文章目录 论文1、规划范围管理2、收集需求3、定义范围4、创建工作分解结构(WBS)5、确认范围6、控制范围论文 2017年5月,我作为项目经理参加XX省电网公司保供电可视化系统应用项目的建设,该项目是2017年XX省电网信息化…...

如何高效查询订单销售情况与售罄率:从SQL到架构优化的全流程设计

在电商平台、SaaS多租户系统中,订单数据作为核心数据之一,承载了关键的运营指标,如销售额、商品售罄率、订单转化等。随着数据量的持续增长,如何在大数据量条件下快速、稳定地获取统计信息,成为系统设计的重点之一。 本文将从查询目标分析入手,结合数据库设计优化与典型…...

RTT添加一个RTC时钟驱动,以DS1307为例

添加一个外部时钟芯片 这里多了一个选项 复制drv_rtc.c,重命名为drv_rtc_ds1307.c 添加到工程中 /*** @file drv_rtc_ds1307.c* @brief * @author jiache (wanghuan3037@fiberhome.com)* @version 1.0* @date 2025-01-08* * @copyright Copyright (c) 2025 58* */ #...

Leetcode 独一无二的出现次数

可以通过哈希集来判断是否独一无二&#xff0c;如果set中已经包含了count&#xff0c;那么set.add(count)会返回false class Solution {public boolean uniqueOccurrences(int[] arr) {Map<Integer, Integer> map new HashMap<>();for(int i 0; i < arr.leng…...

ubuntu上,e1000e,i1210有线网卡驱动安装

1&#xff0c;下载附属资源&#xff0c;解压对应的压缩包 tar zxf e1000e-<x.x.x>.tar.gz 2&#xff0c;进入压缩包src目录下 cd e1000e-<x.x.x>/src/ 3&#xff0c;安装 sudo make install 4&#xff0c;重启 reboot e1000e Intel官网下载地址 https://www.i…...

Xmind 2025 中文思维导图

Xmind 2025 中文思维导图 一、介绍 Xmind &#xff0c;是一款出色的思维导图和头脑风暴软件&#xff0c;拥有美观的智能配色方案&#xff0c;便于你轻松理清思路捕捉创意。丰富的导图模板及多种创意整合工具&#xff0c;可助力导图迸发更多活力。还拥有强大演说模式&#xff…...

搭载DeepSeek|暴雨AI教育一体机加速AI教育普及

近日&#xff0c;在全国智算大会上&#xff0c;暴雨公司展示了新一代 AI 教育一体机&#xff0c;通过全栈国产化技术与 DeepSeek 模型的深度适配&#xff0c;打造低成本、高性能的人工智能教育解决方案&#xff0c;助力 AI 教育普及与教育数字化转型。 暴雨AI教育一体机&#…...

【字节跳动AI论文】Seaweed-7B:视频生成基础模型的高成本效益培训

摘要&#xff1a;本技术报告介绍了一种经济有效的视频生成基础模型训练策略。 我们提出了一种中等规模的研究模型&#xff0c;大约有70亿个参数&#xff08;7B&#xff09;&#xff0c;称为Seaweed-7B&#xff0c;使用665,000个H100 GPU小时从头开始训练。 尽管使用适度的计算资…...

java 线程池:IO密集型的任务(CPU核数 * 2 + 1),为什么这么设置,计算密集型任务( CPU核数+1 ),为什么这么设置

文章目录 1. IO密集型任务:`CPU核数 2 + 1`为什么这样设置?示例场景:2. CPU密集型任务:`CPU核数 + 1`为什么这样设置?示例场景:3. 两者的核心差异4. 实际应用中的注意事项5. 总结在Java线程池的配置中, IO密集型和 CPU密集型任务的线程数设置逻辑存在显著差异,核心原…...

RabbitMQ消息的可靠性

生产者的可靠 首先&#xff0c;我们一起分析一下消息丢失的可能性有哪些。 消息从发送者发送消息&#xff0c;到消费者处理消息&#xff0c;需要经过的流程是这样的&#xff1a; 消息从生产者到消费者的每一步都可能导致消息丢失&#xff1a; ● 发送消息时丢失&#xff1a;…...

涵盖通算、智算、超算、量算!“四算合一”算力网络投入使用,效率提升20%

近日&#xff0c;由中国移动承建的全国首个“四算合一”算力网络调度平台日前正式投入使用。这座“数字三峡”的诞生&#xff0c;标志着我国算力基建完成从“单兵作战”到“军团协同”的跃迁。 什么是“四算合一”&#xff1f; “四算合一”是指将通用算力、智能算力、超级算…...

【Redis】数据结构和内部编码

先来复习一下之前学过的几个基本的全局命令&#xff1a; keys&#xff1a;用来查看匹配规则的keyexists&#xff1a;用来判定执行key是否存在del&#xff1a;删除指定的keyexpire&#xff1a;给key设置过期时间ttl&#xff1a;查询key的过期时间type&#xff1a;查询key对应的…...

考研数据结构之二叉树(一)(包含真题及解析)

考研数据结构之二叉树&#xff08;一&#xff09; 下期预告&#xff1a;后续文章将深入探讨二叉树的遍历算法与高频考点&#xff08;如平衡二叉树、线索二叉树&#xff09;。 二叉树是数据结构中的核心内容之一&#xff0c;也是考研高频考点。本文将从定义和存储结构两方面展开…...

linux多线(进)程编程——番外1:内存映射与mmap

前言 在修真世界之外&#xff0c;无数异世界&#xff0c;其中某个叫地球的异世界中&#xff0c;一群人对共享内存的第二种使用方式做出了讲解。 内核空间与用户空间 内存空间的划分 Linux操作系统下一个进程的虚拟地址空间被分为用户空间与内核空间 Linux 内核空间在内存管…...

旧版 VMware 虚拟机迁移至 KVM 平台-案例2

项目背景 需将一台旧版 VMware 虚拟机&#xff08;VMDK 格式&#xff09;迁移至 KVM 虚拟化平台&#xff0c;具体要求如下&#xff1a; 格式转换&#xff1a;将 VMDK 转换为 QCOW2 格式。磁盘扩容&#xff1a;将原 40GB 磁盘扩展至 60GB。密码重置&#xff1a;修改 aiden 用户…...

六、adb通过Wifi连接

背景 收集是荣耀X40,数据线原装全新的&#xff0c;USB连上之后&#xff0c;老是断&#xff0c;电脑一直叮咚叮咚的响个不停&#xff0c;试试WIFI 连接是否稳定&#xff0c;需要手机和电脑用相同的WIFI. 连接 1.通过 USB 连接手机和电脑(打开USB调试等这些都略过) adb device…...

Kafka使用方式与底层原理解析

一、Kafka简介 Apache Kafka是一个分布式流处理平台&#xff0c;由LinkedIn开发并开源&#xff0c;现已成为实时数据管道和流应用的核心组件。它具备高吞吐量、低延迟、高可扩展性等特点&#xff0c;广泛应用于日志收集、消息系统、流处理等领域。 1.1 Kafka核心概念 Topic&…...

【Python内置函数的深度解析与应用】id

目录 前言&#xff1a;技术背景与价值当前技术痛点解决方案概述目标读者说明 一、技术原理剖析核心概念图解关键技术模块技术选型对比 二、实战演示环境配置要求核心代码实现1. 基础身份验证2. 不可变对象优化3. 对象生命周期追踪 运行结果验证 三、性能对比测试方法论量化数据…...

【Pandas】pandas DataFrame keys

Pandas2.2 DataFrame Indexing, iteration 方法描述DataFrame.head([n])用于返回 DataFrame 的前几行DataFrame.at快速访问和修改 DataFrame 中单个值的方法DataFrame.iat快速访问和修改 DataFrame 中单个值的方法DataFrame.loc用于基于标签&#xff08;行标签和列标签&#…...

探索QEMU-KVM虚拟化:麒麟系统下传统与云镜像创建虚拟机的最佳实践

随着云计算和虚拟化技术的不断进步&#xff0c;虚拟化在管理服务器、隔离资源以及提升性能方面的好处越来越明显。麒麟操作系统Kylin OS是我们国家自己开发的操作系统&#xff0c;在政府机构和企业中用得很多。这篇文章会教你如何在麒麟操作系统上设置QEMU-KVM虚拟化环境&#…...

pycharm中调试功能讲解

一、调试前的准备工作​​ 1. 准备一段测试代码 先写一个简单的Python脚本&#xff08;比如计算阶乘&#xff09;&#xff0c;故意留点问题&#xff1a; def factorial(n):result 1for i in range(n):result * ireturn resultprint(factorial(5)) # 预期输出120&#xff0…...

SimpleITK (sitk) 中查看 DICOM 文件的像素位深(8位或16位)

在 SimpleITK (sitk) 中查看 DICOM 文件的像素位深&#xff08;8位或16位&#xff09;&#xff0c;可以通过以下方法实现&#xff1a; 方法一&#xff1a;通过 图像像素数组的数据类型 判断 读取 DICOM 文件&#xff1a; 使用 sitk.ReadImage() 加载文件&#xff0c;生成图像对…...

day28图像处理OpenCV

文章目录 一、图像预处理4 边缘填充4.1 边界复制&#xff08;BORDER_REPLICATE&#xff09;4.2 边界反射&#xff08;BORDER_REFLECT&#xff09;4.3 边界反射101&#xff08;BORDER_REFLECT_101&#xff09;4.4 边界常数&#xff08;BORDER_CONSTANT&#xff09;4.5 边界包裹&…...

【NLP】 自然语言处理笔记

NLP的全称是Natuarl Language Processing,中文意思是自然语言处理,是人工智能领域的一个重要方向。自然语言处理(NLP)就是在机器语言和人类语言之间沟通的桥梁,以实现人机交流的目的。 人类语言是抽象的信息符号,其中蕴含着丰富的语义信息,人类可以很轻松地理解其中的含…...

LaTeX 的pstricks-add宏绘图练习

练习。 \documentclass[10pt]{article} \usepackage{pstricks-add} \pagestyle{empty} \begin{document} \psset{xunit1.0cm,yunit1.0cm,algebraictrue,dimenmiddle,dotstyleo,dotsize5pt 0,linewidth2.pt,arrowsize3pt 2,arrowinset0.25} \begin{pspicture*}(-16.5581463…...

WITRAN_2DPSGMU_Encoder 类中,门机制

WITRAN_2DPSGMU_Encoder 类中的门机制详解 在 WITRAN_2DPSGMU_Encoder 类中&#xff0c;门机制是核心部分&#xff0c;类似于 LSTM 或 GRU 的门控机制&#xff0c;用于控制隐藏状态的更新和输出。以下是对门机制的详细解析。 1. 门机制的作用 门机制的主要作用是&#xff1a;…...

OSI参考模型和TCP/IP模型

1.OSI参考模型 OSI模型&#xff1a; OSI参考模型有7层&#xff0c;自下而上依次为物理层&#xff0c;数据链路层&#xff0c;网络层&#xff0c;传输层&#xff0c;会话层&#xff0c;表示层&#xff0c;应用层。&#xff08;记忆口诀&#xff1a;物联网叔会用&#xff09;。低…...

3D版的VLA:从3D VLA、SpatialVLA到PointVLA——3D点云版的DexVLA,在动作专家中加入3D数据

前言 之前写这篇文章的时候&#xff0c;就想解读下3D VLA来着&#xff0c;但一直因为和团队并行开发具身项目&#xff0c;很多解读被各种延后 更是各种出差&#xff0c;比如从25年3月下旬至今&#xff0c;连续出差三轮&#xff0c;绕中国半圈&#xff0c;具身占八成 第一轮 …...

java: 需要‘)‘ java: 未结束的字符串文字,java: 不是语句,怎么解决

java: 需要’)’ IDE运行当中因为字符串中的JSON串&#xff0c;导致编码不对&#xff0c;IDEA编码识别错误&#xff0c;编译不过&#xff0c;程序运行不起来&#xff0c;解决办法。 第一步&#xff0c;进行修改编码进行尝试 第二步&#xff0c;继续修改编码...