![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
文章平均质量分 56
仟北代~
乾坤已定,你我皆是牛马
展开
-
redux的@reduxjs/toolkit + Hooks用法
介绍@reduxjs/toolkit + hooks + reacr-redux的用法原创 2022-10-28 18:15:00 · 2603 阅读 · 0 评论 -
react的组件之间的通讯方式 (全局通讯和跨级通讯)
1.跨级通讯创建一个createContext文件 里面导出一个myContextimport { createContext } from "react";const myContext = createContext()export default myContext父组件import ChilA from "./com/chilA"; // 子组建import React from "react";import myContext from './createContex原创 2022-02-22 11:01:11 · 584 阅读 · 0 评论 -
react - Hooks
1.useEffectimport React,{useEffect,useState} from 'react'export default function App() { const [count,setCount] = useState(0) useEffect(() => { // 如果是一个空数组 就表示谁都不依赖 那么就只会在第一次加载的时候执行一次 // 当添加了依赖的时候 就会在count变化的时候 实行监听 console.log('修改d原创 2022-02-11 14:37:08 · 393 阅读 · 0 评论 -
react-router@5.2.0
1.下载 react-router-dom2.引入import { HashRouter, Link, Route, Switch, withRouter} from 'react-router-dom' <HashRouter> <Link to='/'>首页</Link> <Link to='/about'>关于</Link> <Link原创 2022-02-10 15:43:53 · 909 阅读 · 0 评论 -
react-redux多容器数据共享版
上一篇文章记录了一个容器组件的使用 ,但在一个项目开发中,肯定不止一个容器组件 所以在这里更新一个多个容器组件的数据共享的版本实现起来比较简单 只是在上一篇文章的基础上 合并多个容器组件就可以了有两个容器组件 一个为name容器组件 一个为 count容器组件两个容器组件之间互相用了对方的数据当我修改的时候 两个组件的内容都会发生改变下面我们来实现一下这个功能目录结构与之前的一样actions.js 把所有的请求任务的内容都写在这里expo...原创 2021-12-27 13:35:17 · 521 阅读 · 0 评论 -
react-redux的使用
以一个例子来说明,页面上有一个初始值 10 当我点击 add的时候,给这个值加5 ‘当点击 asyncAdd的时候,在1秒钟后 加 5 1.划分目录结构src container containerCount redux action action.js reducer count.js store.js app.jsx ...原创 2021-12-23 22:33:35 · 601 阅读 · 0 评论 -
插槽、跨级传值
class Child extends Component { render() { const {left,center,right} = this.props return ( <div className='ccc'> <div className='left'> {left} </div> <div className='center'> .原创 2021-11-27 23:42:52 · 548 阅读 · 0 评论 -
react组件实例三大属性
1.state属性<scripttype="text/babel">//1.创建组件classWeatherextendsReact.Component{//初始化状态state={isHot:false,wind:'微风'}render(){const{isHot,wind}=this.st...原创 2021-10-07 11:51:36 · 140 阅读 · 0 评论 -
React生命周期函数(旧版)
父组件classPersonextendsReact.Component{ //state状态state={carName:"丰田",};//render函数render(){console.log("render--Person");return(<div>...原创 2021-10-01 18:07:31 · 153 阅读 · 0 评论