React
关注
分享
扫一扫
文章平均质量分 69
蛞蝓不孤寡
我这个人是简介不完的
展开
-
React package.json配置参数详解
package.json文件想必大家都不陌生，一般的项目根目录下都会有这个文件，文件中定义了项目所需要的各个模块，以及这个项目的配置信息，例如名称、版本、许可证等。通过执行npm install命令，可以自动下载项目所需要的模块，也就是配置项目所需的运行环境和开发环境。package.json 配置参数很多，大部分并不是必须的，一般都是name、version、main、author、dependencies、devDependencies这几个参数。...原创 2022-08-09 10:12:05 · 3547 阅读 · 0 评论 -
React Hooks的深入学习
ReactHooks的出现，就标志着React不会存在无状态组件的情况，只有类组件和函数组件。原创 2022-07-21 19:37:10 · 467 阅读 · 0 评论 -
react如何使用@引入文件路径？
react如何使用@引入文件路径？问题： 最近忙于毕设，使用react脚手架搭建的项目，在引入文件时出现了下面的情况：预期效果：这样大大提升了代码的美观度，而且简洁明了。1、暴露配置文件react官方脚手架默认是将 webpack 配置隐藏起来了，在进行配置之前需要将 webpack 配置暴露出来。npm run eject# oryarn run eject会出现一个命令提示：这是一个单向操作，确认操作后不可逆转/返回?输入 y 回车成功之后 在项目根目录出现 config 文原创 2022-04-13 15:34:39 · 2130 阅读 · 0 评论 -
解决“Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.”
解决“Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.”问题：import {useState, Fragment} from 'react';import Add from './dialogAdd';function Top() { const [visible, setVisible] = useState(false); const isVisible原创 2021-07-27 11:00:29 · 15474 阅读 · 1 评论 -
export和export default的区别
React 中 export 和 export default 的区别export 与 export default均可用于导出常量、函数、文件、模块，你可以在其它文件或模块中通过 import+(常量 | 函数 | 文件 | 模块)名 的方式，将其导入，以便能够对其进行使用在一个文件或模块中，export、import可以有多个，export default仅有一个通过export方式导出，在导入时要加{ }，export default则不需要，使用export default命令，为模块指定原创 2021-07-27 10:29:19 · 392 阅读 · 0 评论 -
关于React生命周期的补充
React生命周期一、初始化阶段二、运行中阶段三、销毁阶段之前有写过关于 React 的生命周期的一些文章，此文就对之前的文章进行基础知识的巩固和补充，同时也是自己对知识点的回顾过程。React 生命周期一共分为三个阶段：初始化阶段（Mounting）、运行中阶段（Updating）、销毁阶段（Unmounting）一、初始化阶段1、设置组件的默认属性static defaultProps = { name:'zhangsan', age:23}2、设置组件的初始化状态clas原创 2021-05-27 21:47:37 · 145 阅读 · 1 评论 -
React Hooks基础
React Hooks一、Hooks二、React的默认钩子1、useState()实例2、useContext()实例3、useReducer()实例一、HooksReact一直提倡使用函数组件，但是函数组件没有生命周期，没有实例，所以有时候要使用state时，就要使用class类组件，而Hooks就解决了这一问题，在不使用类组件的同时还可以使用state。凡是以 use 开头的 React API 都是 Hooks关于类组件的一些问题代码层级冗余在组件之间复用状态逻辑时，会用到 rend原创 2021-05-27 11:16:44 · 174 阅读 · 3 评论 -
React事件处理
React事件处理一、React事件处理二、React中事件处理函数1、使用ES6的箭头函数2、在组件中定义事件处理函数3、在给事件赋值时绑定this三、事件流四、事件委托五、事件对象六、合成事件与原生事件混合使用七、React事件类型一、React事件处理React元素事件处理和DOM元素的不同：React事件的命名采用驼峰命名法：onClick、onChange响应事件的函数要以对象的形式赋值：DOM形式：<button onclick='myClick()'>点击</原创 2021-03-29 08:37:54 · 282 阅读 · 0 评论 -
React生命周期函数使用实例--时钟组件
思路：React生命周期：挂载、更新、卸载挂载：构造函数constructor(props)： 在初始化状态，绑定函数时使用构造函数super(props); 必须是构造函数的第一句this.state：定义状态机为隐藏时间的button按钮绑定当前组件渲染函数render()： 是class组件中唯一必须实现的方法挂载函数componentDidMount()： 在函数中完成订阅卸载：componentWillUnmount()卸载函数： 清空定时器<body>原创 2021-03-26 19:35:42 · 353 阅读 · 0 评论 -
React State与生命周期
React State与生命周期一、React State介绍二、React组件的生命周期（1）挂载（2）更新（3）卸载一、React State介绍二、React组件的生命周期（1）挂载（2）更新（3）卸载原创 2021-03-23 18:51:21 · 683 阅读 · 0 评论 -
React组件与Props
React组件与Props一、React组件介绍二、React组件分类（1）React函数组件（2）React类组件（3）React组合组件三、React Props介绍四、React Props应用五、React Props只读属性六、React Props默认值七、React组件切分与提取一、React组件介绍React组件可以将UI切分成一些独立的、可复用的部件，这样有助于开发人员专注于构建每一个单独的部件。React组件通过Props可以接收任意的输入值，因此Props也可以理解为参数的概念。原创 2021-03-22 20:58:41 · 449 阅读 · 0 评论 -
React JSX
React JSX一、JSX介绍二、JSX的引用三、JSX中的表达式（1）JSX算术表达式（2）JSX条件表达式（3）JSX嵌入表达式（4）JSX对象表达式（5）JSX函数表达式（6）JSX增强函数表达式（7）JSX数组表达式（8）JSX样式表达式（9）JSX注释表达式一、JSX介绍JSX其实就是JavaScript XML的缩写， 直译过来就是基于JavaScript的XML。同时JSX支持自定义属性，具有很强的扩展性。JSX是React框架的内置语法，建议使用JSX方式来实现UI中的虚拟DOM。注原创 2021-03-22 18:11:23 · 374 阅读 · 0 评论 -
React基础入门
React基础入门React概述ReactDOM.render()方法的语法格式React中的DOMReact的渲染机制React优势React手脚架React概述React是一个JavaScript库，基于JSX的语法，JSX是React的核心组成部分。React核心是组件，组件的设计提高了代码的复用率，降低了测试的难度和代码复杂度，组件将数据和逻辑进行封装。那么JSX又是什么呢？ 首先我们来看看代码：const element = <h1>Hello, world!</h1原创 2021-03-22 16:53:11 · 268 阅读 · 1 评论