Redux之combineReducers方法
摘要：Redux 提供了一个combineReducers方法，用于 Reducer 的拆分。你只要定义各个子 Reducer 函数，然后用这个方法，将它们合成一个大的 Reducer。 import { combineReducers } from 'redux'; const reducer = co
阅读全文
posted @
2021-06-23 15:20
Tsunami黄嵩粟
阅读(95)
推荐(0) 编辑
react 样式继承 属性传递
摘要：# 样式 import styled from 'styled-components' const Button = styled.button` font-size: 20px; border: 1px solid red; border-radius: 3px; `; // 一个继承 Butto
阅读全文
posted @
2021-06-23 15:18
Tsunami黄嵩粟
阅读(140)
推荐(0) 编辑
react css-in-js
摘要：CSS-in-JS是一种技术，而不是一个具体的库实现。简单来说CSS-in-JS就是将应用的CSS样式写在JavaScript文件里面，而不是独立为一些css，scss或less之类的文件，这样你就可以在CSS中使用一些属于JS的诸如模块声明，变量定义，函数调用和条件判断等语言特性来提供灵活的可扩展
阅读全文
posted @
2021-06-23 15:17
Tsunami黄嵩粟
阅读(146)
推荐(0) 编辑
react 利用高阶组件给页面加上动画
摘要：利用高阶组件给页面加上动画 并不想让所有的路由都有动画效果，只是想对指定的页面有路由切换效果，可以利用高阶组件来完成。 # 定义高阶组件 import React, { Component } from 'react' import { CSSTransition } from 'react-tra
阅读全文
posted @
2021-06-23 15:15
Tsunami黄嵩粟
阅读(74)
推荐(0) 编辑
react路由过渡动画效果
摘要：render() { return ( <div> <li><Link to="/home">Home</Link></li> <li><Link to="/child">Child</Link></li> <TransitionGroup> <CSSTransition timeout={1000
阅读全文
posted @
2021-06-23 15:14
Tsunami黄嵩粟
阅读(289)
推荐(0) 编辑
REACT列表过度
摘要：<TransitionGroup> <CSSTransition> <li>aaaa</li> </CSSTransition> </TransitionGroup>
阅读全文
posted @
2021-06-23 15:07
Tsunami黄嵩粟
阅读(55)
推荐(0) 编辑
react 过渡动画组件
摘要：在项目中可能会有一些动画效果展示或是页面切换效果，css动画的方式，比较局限，涉及到一些js动画的时候没法处理了。react-transition-group是react的第三方模块，借住这个模块可以更方便的实现更加复杂的动画效果 安装 npm i -S react-transition-group
阅读全文
posted @
2021-06-23 14:48
Tsunami黄嵩粟
阅读(147)
推荐(0) 编辑
react多级路由 重定向与404定义
摘要：在有一些功能中，往往请求地址的前缀是相同的，不同的只是后面一部份，此时就可以使用多级路由(路由嵌套)来实现此路由的定义实现。 例： 路由规则如下 admin/index admin/user 它们路由前缀的admin是相同的,不同的只是后面一部份 # 重定向 from从哪里来 to重定向到何处去 <
阅读全文
posted @
2021-06-23 14:45
Tsunami黄嵩粟
阅读(129)
推荐(0) 编辑
react自定义导航组件 路由参数
摘要：为何需要自定义导航？ 因为在项目中往往不是所有的声明式导航都是需要a标签完成，有时候可能需要别的标签，此时如果在需要的地方去写编程式导航就会有代码重复可能性，就在对于公共代码进行提取。 思路： 定义一个普通组件可以是类组件也可以是函数式组件 父组件能向子组件传值 props 不管路由规则是否匹配都要
阅读全文
posted @
2021-06-23 14:44
Tsunami黄嵩粟
阅读(145)
推荐(0) 编辑
react withRouter高阶组件
摘要：作用：把不是通过路由切换过来的组件中，将react-router 的 history、location、match 三个对象传入props对象上 默认情况下必须是经过路由匹配渲染的组件才存在this.props，才拥有路由参数，才能使用编程式导航的写法，执行this.props.history.pu
阅读全文
posted @
2021-06-23 14:41
Tsunami黄嵩粟
阅读(72)
推荐(0) 编辑
