React 组件中 State 的定义、使用及正确更新方式
🌈个人主页:前端青山
🔥系列专栏:React篇
🔖人终将被年少不可得之物困其一生
依旧青山,本期给大家带来React篇专栏内容React 组件中 State 的定义、使用及正确更新方式
前言
在 React 应用开发中,state
是组件内部用来存储和管理数据的关键概念。它允许组件根据不同的状态展示不同的 UI。本文将详细介绍 state
的定义、使用方式以及如何正确地更新 state
,帮助开发者更好地理解和运用这一核心特性。
目录
前言
1.1 state及其特点
1.2 state的定义和使用
1.2.1 es6的类 - 构造函数
1.2.2 es7的类 - 属性初始化器
1.3 如何正确的修改state
1.4 this.setState()方法及其特点
1.4.1 传递函数
1.4.2 传递对象
总结
1.1 state及其特点
State 与 props 类似,但是 state 是私有的,并且完全受控于当前组件
不要直接修改state:构造函数是唯一可以给 this.state
赋值的地方。
state更新可能是异步的:出于性能考虑,React 可能会把多个 setState()
调用合并成一个调用。
state更新会被合并:当你调用 setState()
的时候,React 会把你提供的对象合并到当前的 state
1.2 state的定义和使用
目前react中的状态有两种使用方式:
1.2.1 es6的类 - 构造函数
src/index.js
import React from 'react'
import ReactDOM from 'react-dom/client'
// 引入时,后缀名可以省略,可以在webpack中配置
// import App from './01-App-parent-child'
// import App from './02-App-parent-child-value'
// import App from './03-App-parent-child-value-default'
// import App from './04-App-parent-child-value-default-type'
// import App from './05-App-props-children'
// import App from './06-App-mutiple-props-children'
// import App from './07-App-mouse-tracker'
// import App from './08-App-render-props'
import App from './09-App-state-es6'
const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(<App />)
src/09-App-state-es6.jsx
import React, { Component } from 'react';
/*** ES6 规定,子类必须在constructor()方法中调用super(),否则就会报错。
这是因为子类自己的this对象,必须先通过父类的构造函数完成塑造,
得到与父类同样的实例属性和方法,然后再对其进行加工,添加子类自己的实例属性和方法。
如果不调用super()方法,子类就得不到自己的this对象。
ES5 的继承机制,是先创造一个独立的子类的实例对象,然后再将父类的方法添加到这个对象上面,即“实例在前,继承在后”。ES6 的继承机制,则是先将父类的属性和方法,加到一个空的对象上面,然后再将该对象作为子类的实例,即“继承在前,实例在后”*/
class App extends Component {// es6的类 - 构造函数constructor (props) {super(props) // 调用父类的constructor(props)this.state = { // 添加子类自己的实例属性和方法,在react中 state作为初始化状态的属性date: new Date()}}render() {return (<div>现在的时间是:{ this.state.date.toLocaleDateString() + this.state.date.toLocaleTimeString() }</div>);}
}
export default App;
1.2.2 es7的类 - 属性初始化器
src/index.js
import React from 'react'
import ReactDOM from 'react-dom/client'
// 引入时,后缀名可以省略,可以在webpack中配置
// import App from './01-App-parent-child'
// import App from './02-App-parent-child-value'
// import App from './03-App-parent-child-value-default'
// import App from './04-App-parent-child-value-default-type'
// import App from './05-App-props-children'
// import App from './06-App-mutiple-props-children'
// import App from './07-App-mouse-tracker'
// import App from './08-App-render-props'
// import App from './09-App-state-es6'
import App from './10-App-state-es7'
const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(<App />)
src/10-App-state-es7.jsx
import React, { Component } from 'react';
// 推荐写法
class App extends Component {state = { // es7 类的属性date: new Date()}render() {return (<div>现在的时间是:{ this.state.date.toLocaleDateString() + this.state.date.toLocaleTimeString() }!!!</div>);}
}
export default App;
1.3 如何正确的修改state
setState()
将对组件 state 的更改排入队列,并通知 React 需要使用更新后的 state 重新渲染此组件及其子组件。这是用于更新用户界面以响应事件处理器和处理服务器数据的主要方式.
将 setState()
视为请求而不是立即更新组件的命令。为了更好的感知性能,React 会延迟调用它,然后通过一次传递更新多个组件。
setState()
并不总是立即更新组件。它会批量推迟更新。这使得在调用 setState()
后立即读取 this.state
成为了隐患。为了消除隐患,请使用 componentDidUpdate
或者 setState
的回调函数(setState(updater, callback)
),这两种方式都可以保证在应用更新后触发。
记住修改状态的三大原则:
-
不要直接修改 State
state = { a: 10 }
this.state.a = 100 // ❌
-
state 的更新可能是异步的
state = { a: 10 }
this.setState({a: this.state.a + 1 })
this.setState({a: this.state.a + 1 })
this.setState({a: this.state.a + 1 })
console.log(this.state.a) // 10
-
state 的更新会被合并
1.4 this.setState()方法及其特点
setState()
会对一个组件的 state
对象安排一次更新。当 state 改变了,该组件就会重新渲染。
setState()
可以添加两个参数,
setState()
的第二个参数为可选的回调函数,它将在 setState
完成合并并重新渲染组件后执行
1.4.1 传递函数
参数一为带有形式参数的 updater
函数:
this.setState((state, props) => stateChange[, callback] )
src/index.js
import React from 'react'
import ReactDOM from 'react-dom/client'
// 引入时,后缀名可以省略,可以在webpack中配置
// import App from './01-App-parent-child'
// import App from './02-App-parent-child-value'
// import App from './03-App-parent-child-value-default'
// import App from './04-App-parent-child-value-default-type'
// import App from './05-App-props-children'
// import App from './06-App-mutiple-props-children'
// import App from './07-App-mouse-tracker'
// import App from './08-App-render-props'
// import App from './09-App-state-es6'
// import App from './10-App-state-es7'
import App from './11-App-setState-function'
const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(<App />)
src/11-App-setState-function.jsx
import React, { Component } from 'react';
class App extends Component {state = {count: 100}render() {return (<div>{ this.state.count }<button onClick={ () => {this.setState((state, props) => {console.log(state, props)return {count: state.count + 1}})this.setState((state, props) => {console.log(state, props)return {count: state.count + 1}})this.setState((state, props) => {console.log(state, props)return {count: state.count + 1}})} }>加</button></div>);}
}
export default App
updater 函数中接收的
state
和props
都保证为最新。updater 的返回值会与state
进行浅合并。
1.4.2 传递对象
src/index.js
import React from 'react'
import ReactDOM from 'react-dom/client'
// 引入时,后缀名可以省略,可以在webpack中配置
// import App from './01-App-parent-child'
// import App from './02-App-parent-child-value'
// import App from './03-App-parent-child-value-default'
// import App from './04-App-parent-child-value-default-type'
// import App from './05-App-props-children'
// import App from './06-App-mutiple-props-children'
// import App from './07-App-mouse-tracker'
// import App from './08-App-render-props'
// import App from './09-App-state-es6'
// import App from './10-App-state-es7'
// import App from './11-App-setState-function'
import App from './12-App-setState-object'
const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(<App />)
src/12-App-setState-object.jsx
import React, { Component } from 'react';
// 为什么?
// const obj = { a: 100 }
// es6 中对象合并
// const newObj = Object.assign(obj, {a: 100 + 1}, {a: 100 + 1}, {a: 100 + 1})
// console.log(newObj) // { a: 101 }
class App extends Component {state = {count: 10}render() {return (<div>{ this.state.count }<button onClick={ () => {this.setState({count: this.state.count + 1})this.setState({count: this.state.count + 1})this.setState({count: this.state.count + 1})console.log(this.state.count)} }>加</button></div>);}
}
export default App;
这种形式的
setState()
是异步的,并且在同一周期内会对多个setState
进行批处理,相当于Object.assign( prevState, {count: this.state.count + 1}, {count: this.state.count + 1}, ... )后调用的
setState()
将覆盖同一周期内先调用setState
的值,因此商品数仅增加一次。如果后续状态取决于当前状态,建议使用 updater 函数的形式代替(前面案例已经实现)。或者在第二个参数中再继续操作。
src/index.js
import React from 'react'
import ReactDOM from 'react-dom/client'
// 引入时,后缀名可以省略,可以在webpack中配置
// import App from './01-App-parent-child'
// import App from './02-App-parent-child-value'
// import App from './03-App-parent-child-value-default'
// import App from './04-App-parent-child-value-default-type'
// import App from './05-App-props-children'
// import App from './06-App-mutiple-props-children'
// import App from './07-App-mouse-tracker'
// import App from './08-App-render-props'
// import App from './09-App-state-es6'
// import App from './10-App-state-es7'
// import App from './11-App-setState-function'
// import App from './12-App-setState-object'
import App from './13-App-setState-callback'
const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(<App />)
src/13-App-setState-callback.jsx
import React, { Component } from 'react';
class App extends Component {state = {count: 10}render() {return (<div>{ this.state.count }<button onClick={ () => {this.setState({count: this.state.count + 1}, () => {this.setState({count: this.state.count + 1}, () => {this.setState({count: this.state.count + 1})})})console.log(this.state.count) // 10} }>加</button></div>);}
}
export default App;
思考题:
1.何时以及为什么 setState() 会批量执行?
2.为什么不直接更新 this.state?
总结
通过本文的介绍,我们了解了 state
在 React 组件中的重要性,以及如何在 ES6 和 ES7 类组件中定义和使用 state
。同时,我们还探讨了正确更新 state
的方法,包括使用 setState()
方法时需要注意的事项。遵循这些最佳实践,可以帮助我们避免常见的陷阱,提高应用的性能和可靠性。
相关文章:
React 组件中 State 的定义、使用及正确更新方式
🌈个人主页:前端青山 🔥系列专栏:React篇 🔖人终将被年少不可得之物困其一生 依旧青山,本期给大家带来React篇专栏内容React 组件中 State 的定义、使用及正确更新方式 前言 在 React 应用开发中,state …...
18 设计模式之迭代器模式(书籍遍历案例)
一、什么是迭代器模式 迭代器模式(Iterator Pattern)是一种行为型设计模式,允许客户端通过统一的接口顺序访问一个集合对象中的元素,而无需暴露集合对象的内部实现。这个模式主要用于访问聚合对象(如集合、数组等&…...
Springboot3介绍
一、Springboot3简介: https://docs.spring.io/spring-boot/docs/current/reference/html/getting-started.html?spmwolai.workspace.0.0.68b62306Q6jtTw#getting-started.introducing-spring-boot 无论使用XML、注解、Java配置类还是他们的混合用法,配置文件过于…...
【Leetcode Top 100】23. 合并 K 个升序链表
问题背景 给你一个链表数组,每个链表都已经按升序排列。 请你将所有链表合并到一个升序链表中,返回合并后的链表。 数据约束 k l i s t s . l e n g t h k lists.length klists.length 0 ≤ k ≤ 1 0 4 0 \le k \le 10^4 0≤k≤104 0 ≤ l i s t s […...
显存和GPU之间的通信;GPUDirect P2P,NVLink,NCCL;聚合通信和点对点通信
目录 显存和GPU之间的分配 显存和GPU之间的通信 原语是什么,简单举例说明 GPUDirect P2P,NVLink,NCCL的全称及解释 聚合通信和点对点通信 聚合通信(Collective Communication) 点对点通信(Point-to-Point Communication) 为什么使用GPUDirect P2P,NVLink,NCCL…...
2412d,d的7月会议
原文 总结 卡斯滕 Carsten说,Decard一直在大量试验WebAssembly.他们一直在把d运行时挖出来,直到它工作.他们在浏览器中运行了一些库函数,并试了不同虚机. 他们在移动方面遇见了很多问题,因为不同芯片按不同方式工作.他们想让他们的整个SDK在WASM上运行,但可能需要一年时间才…...
vue框架
以下是一个简单的基于Vue框架的日历组件示例: <template><div class"calendar"><div class"header"><button click"prevMonth"><</button><h2>{{ currentMonth }}</h2><button cli…...
Django drf基于APIView 快速使用
1. 注册 # settings.pyINSTALLED_APPS [,rest_framework, ]2. 路由 from django.urls import pathurlpatterns [path(task/, views.TaskAPIView.as_view()) ]3. 视图 from rest_framework.views import APIView from rest_framework.response import Responseclass TaskAPIV…...
git commit -m “Add user login feature“
当然,这条命令是 Git 中用来提交更改的基本命令,其中包含了一些注释来解释命令的各个部分。下面是对这条命令的详细解释: git commit -m "-m指的是message,git要求每次提交都需要写一下日志"git commit: 这…...
mac: docker : Command not found解决
描述: 安装docker但是docker命令显示Command not found 分析: mac没有配置对应的环境变量 解决方案: 打开配置文件: vim ~/.zshrc写docker环境变量: export PATH"/Applications/Docker.app/Contents/Resources/bin:$PATH"保存退出: esc,输入wq,按enter 配置文…...
深入解析 HTML Input 元素:构建交互性表单的核心
🤍 前端开发工程师、技术日更博主、已过CET6 🍨 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 🕠 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 🍚 蓝桥云课签约作者、上架课程《Vue.js 和 E…...
Docker--Docker Registry(镜像仓库)
什么是Docker Registry? 镜像仓库(Docker Registry)是Docker生态系统中用于存储、管理和分发Docker镜像的关键组件。 镜像仓库主要负责存储Docker镜像,这些镜像包含了应用程序及其相关的依赖项和配置,是构建和运行Doc…...
Linux 统信UOS 设置程序“桌面快捷方式”与“开机自启动”
最近在统信uos系统 arm64架构上进行QT程序的开发,基本开发完毕后,开始着手准备程序的开机自启动模块,因为一般来说,程序在客户现场使用都是需要开机自启的。 然后在百度海淘,很少有这类相关的博客介绍,有一…...
React开发高级篇 - React Hooks以及自定义Hooks实现思路
Hooks介绍 Hooks是react16.8以后新增的钩子API; 目的:增加代码的可复用性,逻辑性,弥补无状态组件没有生命周期,没有数据管理状态state的缺陷。 为什么要使用Hooks? 开发友好,可扩展性强&#…...
shell条件测试
一.命令执行结果判定 && 在命令执行后如果没有任何报错时会执行符号后面的动作 || 在命令执行后如果命令有报错会执行符号后的动作 示例: [rootqingdeng shell3]# sh sl.sh /mnt/file is not exist no二.条件判断方法 在 shell 程序中,用户可…...
嵌入式蓝桥杯学习5 定时中断实现按键
Cubemx配置 打开cubemx。 前面的配置与前文一样,这里主要配置基本定时器的定时功能。 1.在Timer中点击TIM6,勾选activated。配置Parameter Settings中的预分频器(PSC)和计数器(auto-reload Register) 补…...
Linux下进程地址空间
文章目录 1. 进程地址空间分布2. 为什么要有进程地址空间一、主要功能二、重要特性三、应用场景四、与TLB的交互 3. 进程具有独立性 以x86(32位)为例子 1. 进程地址空间分布 进程地址空间,本质是一个描述进程可视范围的大小。 地址空间本质是一个内核数据结构,类似…...
基于SpringBoot的养老院管理系统的设计与实现
一、前言 随着人口老龄化的加剧,养老院作为老年人养老的重要场所,其管理的高效性和科学性显得尤为重要。传统的养老院管理方式多依赖人工操作,存在信息记录不及时、不准确,管理流程繁琐,资源调配困难等问题。利用信息技…...
GA-Kmeans-Transformer-GRU时序聚类+状态识别组合模型,创新发文无忧!
GA-Kmeans-Transformer-GRU时序聚类状态识别组合模型,创新发文无忧! 目录 GA-Kmeans-Transformer-GRU时序聚类状态识别组合模型,创新发文无忧!效果一览基本介绍程序设计参考资料 效果一览 基本介绍 1.GA-Kmeans-Transformer-GRU时…...
Hadoop单机搭建手册
hadoop搭建安装指导手册,包含hadoop-3.1.1、hive-3.1.0、zookeeper-3.4.6、hbase-2.3.0、spark-3.3.0等组件版本。文档详细21页,附带所有软件包。笔者发现很多人对于如何快速高效的单机搭建不太清楚,所以笔者整理了这个文档,希望可…...
【射频IC进阶实践教程】2.6 LNA版图设计及DRC/LVS验证
射频集成电路的版图设计非常关键,他对寄生参数非常敏感,需要使其最小化。还需要注意相互耦合的方式本次课程主要介绍射频IC的一些相关布局和连线方面的考虑。 一、版图设计 1. 版图的元件布局 首先打开对应的原理图 点击进行版图设计 由于已经有做好的…...
mac下载安装jdk
背景 长时间不折腾mac全部忘记 特此记录 安装 1.下载jdk 根据需要下载对应的jdk 我直接 下载到/Applicatiions目录 https://www.oracle.com/java/technologies/downloads/#java8-mac 2.解压 cd /Applicatiions tar -zxvf jdk-8u431-macosx-x64.tar.gz 3.配置环境 …...
【uniapp】swiper切换时,v-for重新渲染页面导致文字在视觉上的拉扯问题
问题描述 先用v-for渲染了几个列表,但这几个列表是占同一个位置的,只是通过切换swiper来显示哪个列表显示,也就是为了优化页面切换时候,没有根据swiper的current再更新v-for的数据,但现在就有个问题,怎么隐…...
shell自动显示当前git的branch
效果简介: 1. 如果没在git仓库,显示无变化 2. 如果在git仓库,显示当前分支 实现方法: 在~/.bashrc 里添加: function git_branch { test -d .git && branch"git branch | grep "^\*" | sed…...
使用 Acme.sh 自动生成和续签免费 SSL 证书(含通配符支持)
Acme.sh 是一个开源的脚本,能够从 ZeroSSL、Let’s Encrypt 等证书颁发机构(CA)获取免费的 HTTPS 证书。该脚本特别简单易用,并且支持多种验证方式。下面将详细介绍使用 Acme.sh 生成、安装和更新证书的各个步骤。 Github地址 使用…...
【JAVA】Java高级:Spring框架与Java EE—Web开发基础(Servlet、JSP)
Java作为一种广泛使用的编程语言,提供了强大的Web开发框架和技术,其中Servlet和JSP(JavaServer Pages)是构建动态Web应用的基础。了解这些技术对于任何想要深入Java Web开发的程序员来说都是必不可少的。 一、Web开发的重要性 动…...
pytorch生成对抗网络
# 生成对抗网络 import os import torch import torchvision import torch.nn as nn from torchvision import transforms from torchvision.utils import save_image # Device configuration device torch.device(cuda if torch.cuda.is_available() else cpu) # 超参数 late…...
flask简易版的后端服务创建接口(python)
1.pip install安装Flask和CORS 2.创建http_server.py文件,内容如下 """ ============================ 简易版的后端服务 ============================ """ from flask import Flask, request, jsonify from flask_cors import CORS app = F…...
gitlab 生成并设置 ssh key
一、介绍 🎯 本文主要介绍 SSH Key 的生成方法,以及如何在GitLab上添加SSH Key。GitLab 使用SSH协议与Git 进行安全通信。当您使用 SSH密钥 对 GitLab远程服务器进行身份验证时,您不需要每次都提供您的用户名和密码。SSH使用两个密钥&#x…...
ssh远程升级Ubuntu20.04到Ubuntu 22.04
ssh远程升级Ubuntu20.04到Ubuntu 22.04 陈拓 2024/10/16-2024/10/26 1. 简介 本文介绍了如何通过ssh将Ubuntu系统从20.04升级到22.04。 在进行系统升级之前,建议备份重要数据,以防升级过程中出现问题。 2. 更新当前系统 硬件系统架构 当前操作系统版…...
Qt开源控件:图像查看器工具V1.1
一、项目概述 本项目是一款基于 Qt 框架 开发的 图像查看工具,可以显示带坐标轴的图像,并实时获取图像中任意像素点的坐标和颜色信息。工具具有图像缩放、动态坐标轴绘制、鼠标交互等功能,使用起来方便直观。 二、功能亮点 1. 图像加载与显…...
【WRF-Urban】SLUCM新增空间分布城市冠层参数及人为热排放AHF代码详解(下)
目录 详细解释更改文件内容4 运行模块(run):README.namelist5 输出模块(share):share/module_check_a_mundo.Fshare/output_wrf.F参考SLUCM新增空间分布城市冠层参数及人为热排放AHF代码详解的前两部分内容可参见-【WRF-Urban】SLUCM新增空间分布城市冠层参数及人为热排放A…...
【C#】新建窗体文件,Form、UserControl
从用途、功能性和架构方面进行描述。 1. 继承自 Form 的窗体(通常是窗口): 在 C# 中,Form 是用于创建应用程序的主窗口或对话框窗口的类。当您继承自 Form 时,您创建的是一个完整的窗口,可以显示内容、与…...
优化SEO策略掌握长尾关键词的力量
内容概要 在数字营销领域,SEO(搜索引擎优化)是帮助网站获得更多流量的关键。然而,随着在线竞争的加剧,单纯依赖短尾关键词已难以满足用户的搜索需求。这时,长尾关键词的引入便显得尤为重要。长尾关键词通常…...
MySQL分页查询
分页查询: 数据记录条数过多的时候,需要分页来显示。 语法: select 查询字段 from 表名 where ....等等前面学过的所有写法 limit offset(开始记录索引,是从0开始的),size(要取出的条数)&…...
执行“go mod tidy”遇到“misbehavior”错误
执行“go mod tidy”报错下错误,执行“go clean -modcache”和删除“go env GOMODCACHE”指定目录均无效: SECURITY ERROR go.sum database server misbehavior detected!old database:go.sum database tree3397826xyyhzdyAOat5li/EXx/MK1gONQf3LAGqArh…...
【机器学习】——windows下安装anaconda并在vscode上进行配置
一、安装anaconda 1.进入清华的镜像网站,下载自己电脑对应的anaconda版本。网站:https://repo.anaconda.com/archive/ 这里我下载的版本是anaconda3-2024.10-1-Windows-x86-64 2.下载完毕后开始安装anaconda 3.配置anaconda环境变量 在设置中找到编…...
第6章:布局 --[CSS零基础入门]
CSS 布局是网页设计中至关重要的一个方面,它决定了页面上元素的排列和展示方式。以下是几种常见的 CSS 布局方法和技术: 1. 浮动布局(Float Layout) 浮动布局(Float Layout)曾经是网页设计中创建多列布局…...
kubeadm安装K8s集群基础环境配置
kubeadm安装K8s集群基础环境配置 1.首先确保所有机器可以通信,然后配置主机hosts文件;2.关闭所有节点关闭防火墙、selinux、swap;3.将桥接的IPv4流量传递到 iptables;4.安装常用工具包;5.安装时间同步工具ntpdate&…...
计算机毕业设计Python医疗问答系统 医疗可视化 BERT+LSTM+CRF深度学习识别模型 机器学习 深度学习 爬虫 知识图谱 人工智能 大数据毕业设计
温馨提示:文末有 CSDN 平台官方提供的学长联系方式的名片! 温馨提示:文末有 CSDN 平台官方提供的学长联系方式的名片! 温馨提示:文末有 CSDN 平台官方提供的学长联系方式的名片! 作者简介:Java领…...
学在西电录播课使用python下载,通过解析m3u8协议、多线程下载ts视频块以及ffmpeg合并
本文涵盖的内容仅供个人学习使用,如果侵犯学校权利,麻烦联系我删除。 初衷 研究生必修选逃, 期末复习怕漏过重点题目,但是看学在西电的录播回放课一卡一卡的,于是想在空余时间一个个下载下来,然后到时候就…...
攻防世界杂项刷题笔记(引导模式)13-23
引言:14包括提取文件和流量分析,22很新颖!!其他的都是常规隐写 13.base64stego 经过上一次如来十三掌的磨练,这题在看到题干“十三掌”的时候我是丝毫不慌张的。附件给了压缩包,考虑是不是伪加密…...
基于单片机的智能农田灌溉节水系统设计及应用
摘 要 : 针对传统的灌溉方法浪费水资源节水系统设计。该系统从节水角度出发,对传感器和主电路进行了设计,主要采集灌溉地的湿度与温度数据,根据测量土壤中的温度与湿度作为主要参数,对农田灌溉节水系统进行实时控制&am…...
高校毕业生离校就业数据分析管理平台的设计与实现(Java毕业设计)教务管理、就业统计
系统合集跳转 源码获取链接 一、系统环境 运行环境: 最好是java jdk 1.8,我们在这个平台上运行的。其他版本理论上也可以。 IDE环境: Eclipse,Myeclipse,IDEA或者Spring Tool Suite都可以 tomcat环境: Tomcat 7.x,8.x,9.x版本均可 操作系统…...
1、SQL语言
分类方式 类别描述 部署方式 嵌入式/单机/双机/集群/分布式/云数据库 业务类型 OLTP数据库/OLAP数据库/流数据库/时序数据库 存储介质 内存数据库/磁盘数据库/SSD数据库/SCM数据库 年代 第一代是单机数据库/第二代是集群数据库/第三代是分布式数据库和云原生数据库/第…...
spark sql 环境安装,java 默认路径和 安装配置!
yum安装java 查看默认路径 update-alternatives --config java # Java 环境变量 export JAVA_HOME/usr/lib/jvm/java-1.8.0-openjdk-1.8.0.412.b08-1.el7_9.x86_64/jreexport PATH$JAVA_HOME/bin:$PATH# Spark 环境变量 export SPARK_HOME/home/vagrant/soft/sparkexport PATH…...
【CMD、PowerShell和Bash设置代理】
【CMD、PowerShell和Bash设置代理】 1. CMD(命令提示符)临时设置代理(只对当前会话有效):查看当前代理设置:清除临时代理设置:永久设置代理(对所有新的 CMD 会话有效)&am…...
分区之间的一种度量方法-覆盖度量(Covering Metric)
分区之间的一种度量方法——覆盖度量(Covering Metric),用于量化一个分区如何被另一个分区覆盖或近似。以下是逐步详细解释: 1. 背景与符号说明 分区的概念: 分区是将一个集合(这里是 { 1 , … , n } \{…...
HarmonyOS(64) wrapBuilder 全局@Builder使用利器
WrapBuilder 全局Builder是什么什么时候使用wrapBuilderBuilder的限制参考资料 全局Builder是什么 局部Builder的定义方法如下: //定义局部Builder Builder MyBuilderFunction() {} //使用方法 this.MyBuilderFunction()全局Builder定义语法如下: //全…...
【计算机毕设】基于Spark猫眼电影票房数据分析预测推荐系统(完整系统源码+数据库+开发笔记+详细部署教程+虚拟机分布式启动教程)✅
目录 【计算机毕设】基于Spark猫眼电影票房数据分析预测推荐系统(完整系统源码数据库开发笔记详细部署教程虚拟机分布式启动教程)✅ 一、项目背景 二、研究目的 三、项目意义 四、项目功能 五、项目创新点 六、开发技术介绍 七、算法介绍 八、数…...