- 创建虚拟DOM元素 什么是虚拟DOM 用js对象的形式，来表示DOM和DOM之间的嵌套关系。 const mydiv = React. createElement( 'div', { id: 'mydiv', title: 'div aaa' }, '这是一 个div元素' ) 12345 React. createElement 参数1 创建的元素的... 创建虚拟DOM元素 什么是虚拟DOM 用js对象的形式，来表示DOM和DOM之间的嵌套关系。 const mydiv = React. createElement( 'div', { id: 'mydiv', title: 'div aaa' }, '这是一 个div元素' ) 12345 React. createElement 参数1 创建的元素的...
- 声明 State 变量 在 class 中，我们通过在构造函数中设置 this.state 为 { count: 0 } 来初始化 count state 为 0： class Example extends React.Component { constructor(props) { super(props); this.state = { count: 0 ... 声明 State 变量 在 class 中，我们通过在构造函数中设置 this.state 为 { count: 0 } 来初始化 count state 为 0： class Example extends React.Component { constructor(props) { super(props); this.state = { count: 0 ...
- ReactJS 的核心思想是组件化，即按功能封装成一个一个的组件，各个组件维护自己的状态和 UI，当状态发生变化时，会自定重新渲染整个组件，多个组件一起协作共同构成了 ReactJS 应用。 为了能够更好的创建和使用组件，我们首先要了解组件的生命周期。 生命周期节点 Mounting :挂载阶段Updating :运行时阶段Unmounting :卸载阶段Erro... ReactJS 的核心思想是组件化，即按功能封装成一个一个的组件，各个组件维护自己的状态和 UI，当状态发生变化时，会自定重新渲染整个组件，多个组件一起协作共同构成了 ReactJS 应用。 为了能够更好的创建和使用组件，我们首先要了解组件的生命周期。 生命周期节点 Mounting :挂载阶段Updating :运行时阶段Unmounting :卸载阶段Erro...
- 文章目录 前言React中bind方法的选择 前言 在React或React-native的点击事件中，会经常用到bind(this)。比如说一个简单的React-native点击组件： export default class AwesomeProject extends Component { constructor(props){ s... 文章目录 前言React中bind方法的选择 前言 在React或React-native的点击事件中，会经常用到bind(this)。比如说一个简单的React-native点击组件： export default class AwesomeProject extends Component { constructor(props){ s...
- 五一假期和老罗巴扎嘿规划了一个导航站点, 老罗负责设计，我负责实现。 导航站素材是不缺的，我和老罗都是资源达人，想要做的长远，要考虑未来开发和维护的方便。 方圆灵感导航 v2fy.com/in 起名字 方圆是我和老罗一直做大做强的关键词, 灵感很符合导航站的调性! 网站最终命名为方圆灵感导航 使用React模块化开发 为了避免后期功能繁多，难以维护，我选用业内广受好... 五一假期和老罗巴扎嘿规划了一个导航站点, 老罗负责设计，我负责实现。 导航站素材是不缺的，我和老罗都是资源达人，想要做的长远，要考虑未来开发和维护的方便。 方圆灵感导航 v2fy.com/in 起名字 方圆是我和老罗一直做大做强的关键词, 灵感很符合导航站的调性! 网站最终命名为方圆灵感导航 使用React模块化开发 为了避免后期功能繁多，难以维护，我选用业内广受好...
- 普通写法 原来在组件中connect连接redux的写法是: import { connect } from 'react-redux'; import { start, stop, reset } from './actions'; class Home extends Component { ... // dispatch一个action this.props... 普通写法 原来在组件中connect连接redux的写法是: import { connect } from 'react-redux'; import { start, stop, reset } from './actions'; class Home extends Component { ... // dispatch一个action this.props...
- 在ReactNative启动完成之后，就会加载jsbundle中的js代码，进入js层渲染。 为什么讲 ReactNative JS 层渲染，重点讲 diff 算法呢？ 使用 React 写过 Web 和 ReactNative的，能很明显感觉到：除了组件命名不一样之外，生命周期、刷新机制等几乎是完全一样的，这也就是 Facebook 所说的“learn onc... 在ReactNative启动完成之后，就会加载jsbundle中的js代码，进入js层渲染。 为什么讲 ReactNative JS 层渲染，重点讲 diff 算法呢？ 使用 React 写过 Web 和 ReactNative的，能很明显感觉到：除了组件命名不一样之外，生命周期、刷新机制等几乎是完全一样的，这也就是 Facebook 所说的“learn onc...
- react全家桶： react（整体架构） + redux || mobx（状态管理） + react-router（路由） + axios（ajax请求） + antd || react-material || antd-model(UI框架库) react全家桶： react（整体架构） + redux || mobx（状态管理） + react-router（路由） + axios（ajax请求） + antd || react-material || antd-model(UI框架库)
- React官网（英文基础薄弱的同学，可以去中文网站，不过翻译实在不敢恭维） https://reactjs.org/慕课网免费学习地址（建议按照初级、中级、高级的顺序观看，当然还有其他缴费实战项目，大家各取所需，能薅点羊毛就薅点）： https://www.imooc.com/course/list?c=reactjs React官网（英文基础薄弱的同学，可以去中文网站，不过翻译实在不敢恭维） https://reactjs.org/慕课网免费学习地址（建议按照初级、中级、高级的顺序观看，当然还有其他缴费实战项目，大家各取所需，能薅点羊毛就薅点）： https://www.imooc.com/course/list?c=reactjs
- 如果需要在组件之间进行传值，那么props属性就起到了这个作用,在React中props和state是两个非常重要的属性。 state 和 props 主要区别在于 props 是不可变的，而 state 可以根据与用户交互来改变。这就是为什么有些容器组件需要定义 state 来更新和修改数据。 而子组件只能通过 props 来传递数据。 Note:属性是用于设置默... 如果需要在组件之间进行传值，那么props属性就起到了这个作用,在React中props和state是两个非常重要的属性。 state 和 props 主要区别在于 props 是不可变的，而 state 可以根据与用户交互来改变。这就是为什么有些容器组件需要定义 state 来更新和修改数据。 而子组件只能通过 props 来传递数据。 Note:属性是用于设置默...
- 在组件的整个生命周期中，随着该组件的props或者state发生改变，其DOM表现也会有相应的变化。 一个组件就是一个状态机，对于特定地输入，它总返回一致的输出。 一个React组件的生命周期分为三个部分：实例化、存在期和销毁时。 React应用中，组件加载顺序及生命周期如下图所示： constructor( ) constructor是ES6对类的默认方法... 在组件的整个生命周期中，随着该组件的props或者state发生改变，其DOM表现也会有相应的变化。 一个组件就是一个状态机，对于特定地输入，它总返回一致的输出。 一个React组件的生命周期分为三个部分：实例化、存在期和销毁时。 React应用中，组件加载顺序及生命周期如下图所示： constructor( ) constructor是ES6对类的默认方法...
- 前言 React-Redux 将所有组件分成两大类：UI 组件（presentational component）和容器组件（container component）。 UI组件 只负责 UI 的呈现，不带有任何业务逻辑； 没有状态（即不使用this.state这个变量）； 所有数据都由参数（this.props）提供； 不使用任何 Redux 的 A... 前言 React-Redux 将所有组件分成两大类：UI 组件（presentational component）和容器组件（container component）。 UI组件 只负责 UI 的呈现，不带有任何业务逻辑； 没有状态（即不使用this.state这个变量）； 所有数据都由参数（this.props）提供； 不使用任何 Redux 的 A...
- 前言 在项目开发过程中，有时候苦恼于eslint的校验规则，例如变量、方法定义时空格等的校验。 主要有两种方式可实现关闭eslint提醒。 第一种方式 在react-scripts依赖包下的config目录找到webpack.config.js配置文件，在webpack.config.js中注释掉以下代码： { test: /\.(js|mjs|jsx|ts|... 前言 在项目开发过程中，有时候苦恼于eslint的校验规则，例如变量、方法定义时空格等的校验。 主要有两种方式可实现关闭eslint提醒。 第一种方式 在react-scripts依赖包下的config目录找到webpack.config.js配置文件，在webpack.config.js中注释掉以下代码： { test: /\.(js|mjs|jsx|ts|...
- 在《React进阶（四）：路由介绍》博文中，介绍了React路由相关知识，在实际项目开发过程中，路由之间的跳转必定涉及权限、用户是否登陆等限定条件的判定，故需要导航守卫来完成这一事项。 在实现react-router路由拦截之前，先看一下vue路由拦截是怎么使用的，都做到了哪些事情。 正如其名，vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航... 在《React进阶（四）：路由介绍》博文中，介绍了React路由相关知识，在实际项目开发过程中，路由之间的跳转必定涉及权限、用户是否登陆等限定条件的判定，故需要导航守卫来完成这一事项。 在实现react-router路由拦截之前，先看一下vue路由拦截是怎么使用的，都做到了哪些事情。 正如其名，vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航...
- 在React SPA项目开发过程中，路由跳转必不可少。本篇博文主要介绍下React中路由相关知识。 在React中，常用的有两个包可以实现这个需求，那就是react-router和react-router-dom。本文主要针对react-router-dom进行说明。 安装 首先进入项目目录，使用npm安装react-router-dom： npm instal... 在React SPA项目开发过程中，路由跳转必不可少。本篇博文主要介绍下React中路由相关知识。 在React中，常用的有两个包可以实现这个需求，那就是react-router和react-router-dom。本文主要针对react-router-dom进行说明。 安装 首先进入项目目录，使用npm安装react-router-dom： npm instal...
上滑加载中
推荐直播
-
HDC深度解读系列 - AI时代的华为开发者空间2025/07/24 周四 16:30-18:00
Edwin 华为开发者空间产品总监 姚圣伟 HCDG天津核心组代表&HCDE
继HDC发布开发者空间新特性后，本期直播聚焦华为开发者空间核心升级，邀您一起深度解读其如何赋能AI时代智能应用开发，解锁开发新体验
回顾中 -
OpenHarmony生态构建2025/07/24 周四 19:00-20:00
王天一、聂嘉一 -华为开发者布道师-高校学生
本次直播将结合讲师的实践经验，深入剖析OpenHarmony开发中的核心痛点与难点，展示从入门到进阶的多层次开发案例，并分享高效的学习路径、实用开发技巧和常见问题的解决方案。同时，我们还将探讨OpenHarmony的生态建设，解析测试规范与开发实践，帮助开发者更好地适配多设备，共同推动OpenHarmony生态的发展。
回顾中
热门标签