![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react
风吹@头皮凉
just do it。
QQ: 1391020642
展开
-
react项目配置不同环境下的接口地址
思路就是使用配置文件 和全局变量1 修改package.json记得先npm i cross-env -S "scripts": { "start": "node scripts/start.js", "build": "node scripts/build.js", "test": "node scripts/test.js", //以下为新增命令 // 开发环境启动 "server:dev": "cross-env env_config=de原创 2021-06-30 15:06:36 · 1640 阅读 · 0 评论 -
react入门笔记之数据共享
数据共享父子组件父组件// 渲染子组件 传递 数据 id ; 方法 getId<MenuList id={'111'} getId={(id)=> {this.getId(id)}}></MenuList>getId(id) { console.log('子组件传过来的id', id);// '666'} 子组件 componentDidMount(){ // 输出父组件参数id console.log('this.props.id原创 2021-06-30 10:36:52 · 312 阅读 · 0 评论 -
react入门笔记之路由
路由基本使用import React, { lazy, Suspense } from 'react';// 引入全局cssimport './assets/css/index.css';import { BrowserRouter, Switch, Redirect} from 'react-router-dom';import PrivateRoute from './utils/privateRoute.js'; //私有路由// 加载路由页面组件const Home = lazy((原创 2021-06-30 10:31:03 · 171 阅读 · 0 评论 -
react入门笔记之组件生命周期
生命周期各阶段调用顺序// 1. 初始化阶段: 由ReactDOM.render()触发---初次渲染// 1. constructor()// 2. getDerivedStateFromProps // 3. render()// 4. componentDidMount() =====> 常用// 一般在这个钩子中做一些初始化的事,例如:开启定时器、发送网络请求、订阅消息// 2. 更新阶原创 2021-06-30 10:22:35 · 145 阅读 · 0 评论 -
react入门笔记
路由基本使用import React, { lazy, Suspense } from 'react';// 引入全局cssimport './assets/css/index.css';import { BrowserRouter, Switch, Redirect} from 'react-router-dom';import PrivateRoute from './utils/privateRoute.js'; //私有路由const Home = lazy(() => imp原创 2021-06-28 14:55:21 · 164 阅读 · 0 评论 -
react各生命周期函数使用场景:
1. Constructor(props)使用场景:初始化局部State或把方法的句柄绑定到实例注意:第一个语句必须是super(props)2.GetDerivedStateFromProps(props,state)使用场景:内部state变化依赖于props时,注意:不要过度使用该函数。 如果你的操作依赖于props的更改并有副作用,最好放到ComponentDidUpdate中; 如果需要根据props的改变更新某些数据,最好使用memoization...原创 2021-06-23 11:02:40 · 270 阅读 · 0 评论 -
react-router4.x 路由控制
1.第一种封装一个私有路由这是我的路由配置,Route大家都知道。不用多讲。PrivateRoute 这个是我自己封装的代码如下:PrivateRoute.jsximport React from 'react';import {Route,Redirect,withRouter} from 'react-router-dom';import PropTypes from 'prop-types';import storage from 'utils/storage.js';//私.原创 2020-06-19 11:17:12 · 287 阅读 · 0 评论 -
关于 React Router4,你所需要知道的一切
新的 API 和新的心智模型早期版本的 React Router 会把路由规则放置在一个位置,它们会放置在布局组件之外。当然,路由可以被分割写在多个文件中,不过从概念上来讲它们还是属于同一个单元,最常见的用法其实也是把它们写做一个配置文件。我们用 v3 和 v4 各写一个简单的两页应用来对比它们二者 ,下面例子中的两个路由分别指代 home 页 和 user 页:以下是 v3 版本:...转载 2020-04-27 16:51:06 · 354 阅读 · 0 评论