React 基础案例
React的特点：
1、声明式编程
2、组件化开发
3、多平台适配yuan
原生实现：
<h2 class="title"></h2><button class="btn">改变文本</button><script>let msg = "Hello World";const titleEl = document.querySelector(".title");titleEl.innerHTML = msg;const btnEl = document.querySelector(".btn");btnEl.addEventListener("click", (e) => {msg = "Hello React";titleEl.innerHTML = msg;});</script>React实现：
React开发必须依赖三个库
1、react：包含react所必须的核心代码
2、react-dom：react渲染在不同平台所需要的核心代码
3、babel：将jsx转换成React代码的工具
（1）引入依赖
1、直接CDN引入
2、下载后，添加本地依赖
3、npm管理（脚手架使用）
<body><!-- 添加React依赖 crossorigin属性作用将js脚本的一些错误显示出来 --><scriptsrc="https://unpkg.com/react@16/umd/react.development.js"crossorigin></script><scriptsrc="https://unpkg.com/react-dom@16/umd/react-dom.development.js"crossorigin></script><script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script><div id="app">app</div><!-- 使用jsx ，并且希望script中的jsx代码被解析，必须在script标签中添加一个属性--><!-- jsx特点：多个标签最外层只能有一个根标签 --><script type="text/babel">let msg = "Hello World";function btnClick() {msg = "Hello React";render();}// 渲染的内容，挂载的对象function render() {ReactDOM.render(<div><h2>{msg}</h2><button onClick={btnClick}>改变文本</button></div>,document.getElementById("app"));}render();</script></body>代码组件化
<body><!-- 添加React依赖 crossorigin属性作用将js脚本的一些错误显示出来 --><scriptsrc="https://unpkg.com/react@16/umd/react.development.js"crossorigin></script><scriptsrc="https://unpkg.com/react-dom@16/umd/react-dom.development.js"crossorigin></script><script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script><div id="app">app</div><!-- 使用jsx ，并且希望script中的jsx代码被解析，必须在script标签中添加一个属性--><!-- jsx特点：多个标签最外层只能有一个根标签 --><script type="text/babel">// 封装App组件 想让app是个组件必须先继承class App extends React.Component {// 构造器定义属性constructor() {super(); // 初始化父类实例，才可以使用this// 当数据变化引起页面的变化，不能直接定义在对象里面,必须写在state对象里面this.state = {msg: "Hello World",};}render() {return (<div><h2>{this.state.msg}</h2><button onClick={this.btnClick.bind(this)}>改变文本</button></div>);}btnClick() {//直接修改页面不会发生变化 this.state.msg = "Hello React";// 必须通过一个函数执行 数据更新操作render函数this.setState({msg: "Hello React",});}}ReactDOM.render(<App />, document.getElementById("app"));</script></body>（2）使用脚手架
原生使用的是命令式编程，react使用的是声明式编程
命令式编程：每做一个操作，都是计算机（浏览器）一步步命令
声明式编程：表明想要做什么，应该做什么，但是不指定具体怎么做
相关文章：
React 基础案例
React的特点： 1、声明式编程 2、组件化开发 3、多平台适配yuan 原生实现： <h2 class"title"></h2><button class"btn">改变文本</button><script>let msg "Hello World";const titleEl d…...
【Python探索之旅】选择结构（条件语句）
文章目录 条件结构： 1.1 if单分支结构 1.2 if-else 多分支结构 1.3 if-elif 多重结构： 完结撒花 前言 Python条件语句是通过一条或多条语句的执行结果（True或者False）来决定执行的代码块。 Python提供了顺序、选择、循环三…...
Recommender ~ Collaborative filtering
Using per-item features User j 预测 movie i： Cost Function: 仅求和用户投票过的电影。 常规规范化（usual normalization）：1/2m 正则化项：阻止过拟合 在知晓X的前提下，如何学习w，b参数…...
我觉得POC应该贴近实际
今天我看到一位老师给我一份测试数据。 这是三个国产数据库。算是分布式的。其中有两个和我比较熟悉，但是这个数据看上去并不好。看上去第一个黄色的数据库数据是这里最好的了。但是即使如此，我相信大部分做数据库的人都知道。MySQL和PostgreSQL平时拿出…...
AI 情感聊天机器人工作之旅 —— 与复读机问题的相遇与别离
前言：先前在杭州的一家大模型公司从事海外闲聊机器人产品，目前已经离职，文章主要讨论在闲聊场景下遇到的“复读机”问题以及一些我个人的思考和解决方案。文章内部已经对相关公司和人员信息做了去敏，如仍涉及到机密等情况…...
如何使用ArcGIS Pro进行选房分析
无论是研究城市规划布局还是寻找理想的住房，都需要综合考虑购物、医疗、教育和休闲等多方面因素，此时我们的GIS软件就可以派上用场了，这里为大家介绍一下如何使用 ArcGIS Pro 进行选房分析，希望能对你有所帮助。 数据来源 教程所…...
android图标底色问题，debug与release不一致
背景 在android 8（sdk 26）之前的版本，直接使用图片文件作为图标，开发时比较容易控制图标，但是不同的安卓定制版本就不容易统一图标风格了。 在android 8及之后的版本，图标对应的是ic_launcher.xml&#x…...
如何提高自己的全局视野？
以下是一些可以帮助提高全局视野的方法： 1. 广泛学习不同领域知识：包括但不限于技术相关的各个领域、业务知识、行业动态等，拓宽知识面。 2. 参与大型项目：积极投身到复杂的、规模较大的项目中，在实践中感受和理解系…...
element ui的确认提示框文字样式修改
修改确认提示框文字样式修改，使用message属性修改： 例： js代码： this.$msgbox({title: 确定要删除吗?,message: this.$createElement(p, null, [this.$createElement(span, { style: color: red }, 该素材一旦删除，…...
Typescript 哲学 - ts模块使用最佳实践
ts的作用域 默认是全局（global），这也是为什么在 两个ts文件声明同一个变量报错变量名冲突，解决方法是使某个文件以模块的形式存在（文件顶层使用 export 、import ） In TypeScript, just as in ECMAScript 2…...
自动驾驶决策规划——坐标转换
以下内容来自b站up主忠厚老实的老王，视频链接：自动驾驶决策规划算法序章 总纲与大致目录_哔哩哔哩_bilibilihttps://www.bilibili.com/video/BV1hP4y1p7es/?spm_id_from333.999.0.0&vd_sourced36e625f376908cfa88ef5ecf2fb0ed8侵删。 决策规划算法…...
信创应用软件之邮箱
信创应用软件之邮箱 文章目录 信创应用软件之邮箱采用信创邮箱的必要性信创邮箱采购需求国产邮箱业务形态国产邮箱代表性品牌CoremailRichmail安宁eyouUMail拓波 邮件安全的发展阶段 采用信创邮箱的必要性 邮箱是天然的数据存储空间，党政和央国企客户在使用过程中存…...
TriCore: Architecture
说明 本文是 英飞凌 架构文档 TriCore TC162P core archiecture Volume 1 of 2 (infineon.com) 的笔记，稍作整理方便查阅，错误之处，还请指正，谢谢 :) 1. Architecture 2. General Purpose & System Register 名词列表&#…...
16进制与不同进制之间计算加减乘除的比较快的方法
方法： 1.加分、减法： 将所有的进制的数转成目标进制的数，然后按位加。 如 0x123 0x1234 0x1357 2.乘法、除法： 将所有的进制的数转成二进制数，然后进行移位。 如 0x123456 乘 32（十进制）…...
责任链模式：原理与实现解析，及其应用场景代入
责任链模式的作用：复用和扩展，在实际的项目开发中比较常用，特别是框架开发中，我们可以利用它们来提供框架的扩展点，能够让框架的使用者在不修改框架源码的情况下，基于扩展点定制化框架的功能。 这里主要介…...
从心理学角度看，GPT 对人有什么影响？
开启个性化AI体验：深入了解GPT的无限可能 导言 GPT 与我们日常生活的融合标志着技术进步的重大飞跃，为提高效率和创新提供了前所未有的机遇。然而，当我们与这些智能系统日益紧密地交织在一起时，探索它们对个人产生的细微的心理影响…...
【C语言/数据结构】栈：从概念到两种存储结构的实现
目录 一、栈的概念 二、栈的两种实现方式 1.顺序表实现栈 2.链表实现栈 三、栈的顺序存储结构及其实现 1.栈的声明 2.栈的初始化 3.栈的销毁 4.栈的压栈 5.栈的弹栈 6.栈的判空 7.返回栈顶元素 8.返回栈的长度 四、栈的链式存储结构及其实现 1.栈的声明 2.栈的…...
47. UE5 RPG 实现角色死亡效果
在上一篇文章中，我们实现了敌人受到攻击后会播放受击动画，并且还给角色设置了受击标签。并在角色受击时，在角色身上挂上受击标签，在c里，如果挂载了此标签，速度将降为0 。 受击有了，接下来我们将…...
C语言/数据结构——每日一题（环形链表）
一.前言 今天在力扣上刷到一道链表题——环形链表https://leetcode.cn/problems/linked-list-cycle 想着和大家们分享一下。让我们直接开始今天的分享吧。、 二.正文 1.1题目描述 1.2题目分析 这道题是想让我们做出分析，该链表是不是带环链表，如果是…...
vue：网页icon无法显示
logo文件放在public文件夹下，在html里设置icon。 本地源码运行后发现网页icon无法显示我们设置的logo，而是显示了浏览器默认icon。 这个问题不需要解决，部署后网页icon显示就正常了。...
模型参数、模型存储精度、参数与显存
模型参数量衡量单位 M：百万（Million） B：十亿（Billion） 1 B 1000 M 1B 1000M 1B1000M 参数存储精度 模型参数是固定的，但是一个参数所表示多少字节不一定，需要看这个参数以什么…...
k8s从入门到放弃之Ingress七层负载
k8s从入门到放弃之Ingress七层负载 在Kubernetes（简称K8s）中，Ingress是一个API对象，它允许你定义如何从集群外部访问集群内部的服务。Ingress可以提供负载均衡、SSL终结和基于名称的虚拟主机等功能。通过Ingress，你可…...
Qt Widget类解析与代码注释
#include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this); }Widget::~Widget() {delete ui; }//解释这串代码，写上注释 当然可以！这段代码是 Qt …...
linux arm系统烧录
1、打开瑞芯微程序 2、按住linux arm 的 recover按键 插入电源 3、当瑞芯微检测到有设备 4、松开recover按键 5、选择升级固件 6、点击固件选择本地刷机的linux arm 镜像 7、点击升级 （忘了有没有这步了 估计有） 刷机程序 和 镜像 就不提供了。要刷的时…...
【项目实战】通过多模态+LangGraph实现PPT生成助手
PPT自动生成系统 基于LangGraph的PPT自动生成系统，可以将Markdown文档自动转换为PPT演示文稿。 功能特点 Markdown解析：自动解析Markdown文档结构PPT模板分析：分析PPT模板的布局和风格智能布局决策：匹配内容与合适的PPT布局自动…...
第25节 Node.js 断言测试
Node.js的assert模块主要用于编写程序的单元测试时使用，通过断言可以提早发现和排查出错误。 稳定性: 5 - 锁定 这个模块可用于应用的单元测试，通过 require(assert) 可以使用这个模块。 assert.fail(actual, expected, message, operator) 使用参数…...
【HTML-16】深入理解HTML中的块元素与行内元素
HTML元素根据其显示特性可以分为两大类：块元素(Block-level Elements)和行内元素(Inline Elements)。理解这两者的区别对于构建良好的网页布局至关重要。本文将全面解析这两种元素的特性、区别以及实际应用场景。 1. 块元素(Block-level Elements) 1.1 基本特性 …...
Hive 存储格式深度解析：从 TextFile 到 ORC，如何选对数据存储方案？
在大数据处理领域，Hive 作为 Hadoop 生态中重要的数据仓库工具，其存储格式的选择直接影响数据存储成本、查询效率和计算资源消耗。面对 TextFile、SequenceFile、Parquet、RCFile、ORC 等多种存储格式，很多开发者常常陷入选择困境。本文将从底…...
Razor编程中@Html的方法使用大全
文章目录 1. 基础HTML辅助方法1.1 Html.ActionLink()1.2 Html.RouteLink()1.3 Html.Display() / Html.DisplayFor()1.4 Html.Editor() / Html.EditorFor()1.5 Html.Label() / Html.LabelFor()1.6 Html.TextBox() / Html.TextBoxFor() 2. 表单相关辅助方法2.1 Html.BeginForm() …...
深度学习之模型压缩三驾马车：模型剪枝、模型量化、知识蒸馏
一、引言 在深度学习中，我们训练出的神经网络往往非常庞大（比如像 ResNet、YOLOv8、Vision Transformer），虽然精度很高，但“太重”了，运行起来很慢，占用内存大，不适合部署到手机、摄…...