![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react
文章平均质量分 55
鲜橙多了没
这个作者很懒,什么都没留下…
展开
-
react在非组件环境下获取路由信息
出现这类问题,一般都是在react路由拦截时需要用到当我们在拦截器中拦截到没有token时,应该是让他回到登录页,一般想到的是直接使用window.location.href. 但是用location.href直接赋值会导致页面刷新那如何在非组件内使用history跳转呢?首先说一下背景,react-router-dom中直接有Router这个包,但是它Router 没有history属性有如下公式:Router + HashHistroy = HashRouterRout.原创 2021-11-19 23:36:53 · 1061 阅读 · 0 评论 -
React中路由的基本使用
1. 先下包react-router-dom@5.3.0 可以自己用npm yarncnpm 进行下载,我使用的是5.3.0版本2. 导入并使用import { HashRouter as Router , Route, Link } from 'react-router-dom' export default function App () { return ( <div> <h1>react路由基本使用</h...原创 2021-11-18 21:31:21 · 132 阅读 · 0 评论 -
React 生命周期
一,概念从创建到销毁的整个过程只有类组件有生命周期,函数组件没有生命周期类组件生命周期有3个阶段,5个钩子函数二,生命周期顺序1.Mounting 挂载阶段(初始化)a. constructor(props):初始化 state 和 props 数据,创建Ref等b. render():渲染组件c. componentDidMount():在组件被挂载到页面后执行,只在挂载时执行一次(发送网络请求,dom操作)2.Updation 更新阶段(更新)a.render()..原创 2021-11-10 22:09:56 · 707 阅读 · 0 评论 -
React中受控组件和非受控组件
一,受控组件1.概念:受控组件就是可以被 react 状态控制的组件在 react 中,Input textarea 等组件默认是非受控组件(输入框内部的值是用户控制,和 React 无关)。但是也可以转化成受控组件,就是通过 onChange 事件获取当前输入内容,将当前输入内容作为 value 传入,此时就成为受控组件。好处:可以通过 onChange 事件控制用户输入,使用正则表达式过滤不合理输入。2.步骤:a.在state中定义状态b.对表单元素做两件事:设置value为原创 2021-11-09 18:28:26 · 518 阅读 · 0 评论 -
React组件通信
一,组件通讯介绍基本概念:组件是独立且封闭的单元,默认情况下,只能使用组件自己的数据。在组件化过程中,我们将一个完整的功能拆分成多个组件,以更好的完成整个应用的功能。而在这个过程中,多个组件之间不可避免的要共享某些数据为了实现这些功能,就需要打破组件的独立封闭性,让其与外界沟通。这个过程就是组件通讯二,主要讲三种常用的组件通讯方式父子组件之间兄弟组件之间跨组件层级先了解props基本使用:格式:父组件传入数据<子组件 自定义属性1={值1} 自定义原创 2021-11-08 23:13:13 · 125 阅读 · 0 评论 -
react中JSX的介绍
一,首先,createElement的效率太低了,太繁琐,不够直观所以就引出了JSX,jsx是什么?JSX:是 JavaScript XML的缩写在 JS 代码中书写 XML 结构,JSX 不是标准的 JS 语法,是 JS 的语法扩展。脚手架内置了babel编译包,React用它来创建 UI(HTML)结构简单理解:我们之前用html写页面,现在是用jsx来写页面代码:// 导入react和react-domimport React from 'react'import ReactDO原创 2021-11-05 22:38:30 · 255 阅读 · 0 评论 -
react的基本使用
一,react的基本概念React 是用于构建用户界面的 JavaScript 库构建用户界面: User Interface,对咱们前端来说,简单理解为:HTML 页面二,react全家桶是框架react: 核心库react-dom: dom操作react-router:路由redux:集中状态管理三,React 特点1.声明式用类似于html的语法来定义页面。react中通过数据驱动视图的变化,当数据发生改变react能够高效地更新并渲染DOM<div classNam原创 2021-11-05 22:08:41 · 435 阅读 · 0 评论