![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react
宇智波幽助
这个作者很懒,什么都没留下…
展开
-
深入了解React(十九、路由5-带参数1 )
import React from 'react';import ReactDOM from 'react-dom';import {BrowserRouter as Router, Route, Link} from 'react-router-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';原创 2018-04-21 23:41:01 · 120 阅读 · 0 评论 -
深入了解React(九、父子组件间通信)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class Child extends React.Component { constru原创 2018-04-20 00:01:13 · 613 阅读 · 0 评论 -
深入了解React(十、兄弟组件间通信)
本质就是先把一个子组件数据传输到父组件,然后通过父组件传输到另外一个子组件,这样就实现了兄弟间组件的通信import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scs原创 2018-04-20 00:21:19 · 4630 阅读 · 0 评论 -
深入了解React(十一、生命周期1)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class App extends React.Component { // 构...原创 2018-04-20 09:42:19 · 215 阅读 · 0 评论 -
深入了解React(十二、生命周期2)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class App extends React.Component { // 构造函数原创 2018-04-20 10:08:45 · 124 阅读 · 0 评论 -
深入了解React(十三、生命周期3-更新组件)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class Component extends React.Component { //原创 2018-04-20 10:24:15 · 200 阅读 · 0 评论 -
深入了解React(十四、生命周期4-销毁组件)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class Component extends React.Component { //原创 2018-04-20 10:43:33 · 16331 阅读 · 1 评论 -
深入了解React(十五、路由1)
/** * 页面路由 * @type {string} */// 跳转window.location.href = 'https://www.baidu.com';// 回退history.back();/** * hash 路由 * @type {string} */// 跳转【也可以用a链接】window.location = '#hash';// 事件:onhash原创 2018-04-21 20:08:04 · 190 阅读 · 0 评论 -
深入了解React(十六、路由2)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class A extends React.Component { constructor原创 2018-04-21 20:37:36 · 172 阅读 · 0 评论 -
深入了解React(十七、路由3-HashRouter )
1、安装:yarn add react-router-dom@4.2.2 2、引入:import { HashRouter as Router, Route } from ‘react-router-dom’;import React from 'react';import ReactDOM from 'react-dom';import {HashRouter as Router, Rout原创 2018-04-21 22:02:16 · 297 阅读 · 0 评论 -
深入了解React(八、容器式组件方式组合-2)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class Component extends React.Component { con原创 2018-04-19 23:42:08 · 118 阅读 · 0 评论 -
深入了解React(七、容器式组件方式组合-1)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class Component extends React.Component { con原创 2018-04-19 23:37:44 · 410 阅读 · 0 评论 -
深入了解React(二十、路由6-带参数2 )
import React from 'react';import ReactDOM from 'react-dom';import {BrowserRouter as Router, Route, Link, Switch} from 'react-router-dom';import 'font-awesome/css/font-awesome.min.css';import './inde原创 2018-04-21 23:51:15 · 131 阅读 · 0 评论 -
深入了解React(二十一、路由6-带参数3)
import React from 'react';import ReactDOM from 'react-dom';import {BrowserRouter as Router, Route, Link, Switch} from 'react-router-dom';import 'font-awesome/css/font-awesome.min.css';import './inde原创 2018-04-22 00:00:17 · 305 阅读 · 0 评论 -
深入了解React(一、了解JSX语法)
app.jsx文件import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';let style = { color: 'bl' + 'ue',原创 2018-04-18 13:25:20 · 192 阅读 · 0 评论 -
深入了解React(二、组件JSX语法)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';let jsx = ( <div> <i cl...原创 2018-04-18 13:42:20 · 127 阅读 · 0 评论 -
深入了解React(三、组件传参用法)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';let jsx = ( <div> <i className='fa fa原创 2018-04-18 14:03:57 · 1379 阅读 · 1 评论 -
深入了解React(二十二、状态管理1)
应用场景: 1、状态提升:组件等级扁平,兄弟组件通信情况很少 2、发布订阅:业务规模较小,层级较深的业务 3、Redux:业务复杂,组件层级较深,兄弟组件通信密切原创 2018-04-23 14:03:19 · 194 阅读 · 0 评论 -
深入了解React(四、事件处理方式一)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class Component extends React.Component { con原创 2018-04-19 23:12:50 · 118 阅读 · 0 评论 -
深入了解React(五、事件处理方式二)
用箭头函数方式,这样就不用担心this的指向问题了import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class Component e...原创 2018-04-19 23:15:54 · 103 阅读 · 0 评论 -
深入了解React(六、纯组件方式组合)
import React from 'react';import ReactDOM from 'react-dom';import 'font-awesome/css/font-awesome.min.css';import './index.css';import './index.scss';class Component extends React.Component { con原创 2018-04-19 23:27:25 · 1119 阅读 · 0 评论 -
深入了解React(十八、路由4-BrowserRouter )
1、安装:yarn add react-router-dom@4.2.2 2、引入:import { BrowserRouter as Router, Route } from ‘react-router-dom’;import React from 'react';import ReactDOM from 'react-dom';import {BrowserRouter as Route原创 2018-04-21 22:06:21 · 754 阅读 · 0 评论