随笔- 100
文章- 0
评论- 0
阅读-
8182
08 2022 档案
函数组件
摘要：// 定义函数组件 function HelloFn () { return <div>这是我的第一个函数组件!</div> } // 定义类组件 function App () { return ( <div className="App"> {/* 渲染函数组件 */} <HelloFn />
阅读全文
redux
摘要：redux 是一个专门用于做状态管理的js库（不是react插件库） 可以用在react，angular，vue等项目中，但是基本与react配合使用（因为vue有自己的vuex） 作用：集中式管理react应用中多个组件共享的状态 什么情况下需要使用redux 某个组件的状态，需要让其他组件可以随
阅读全文
BrowserRouter和HashRouter的区别
摘要：底层原理不一样 BrowserRouter使用的是H5的history API，不兼容IE9及以下版本。 HashRouter使用的是URL的hash值 path表现形式不一样 BrowserRouter的路径中没有# HashRouter的路径有# 刷新后对路由state参数的影响 Browser
阅读全文
withRouter
摘要：withRouter 可以加工一般组件，让一般组件具备路由组件所特有的api，比如this.props.history withRouter的返回值是一个新组件 import {withRouter} from 'react-router-dom' export default withRouter
阅读全文
向路由组件传递参数
摘要：params参数 路由链接，携带参数 <Link to={`/about/${this.state.id}`}>about</Link> 注册路由，声明接受 <Route path='/about/:id' component={About}/> 接受参数：this.props.match.para
阅读全文
脚手架配置代理
摘要：方法一 "proxy":"http://localhost:5000" 优点：配置简单，前端请求资源时可以不加任何前缀 缺点：不能配置多个代理 工作方式： 上述方式配置代理，当请求了3000不存在的资源时，那么该请求就会转发给5000，优先匹配前端资源 方法二 创建代理文件，在src下创建配置文件，
阅读全文
react 新生命周期
摘要：新生命周期 初始化阶段：由ReactDOM.render()触发，初次渲染 consctructor() getDerivedStateFromProps render() componentDidMound(), 这个常用，一般在这个钩子中做一些初始化的事情，开启定时器，发送网络请求，订阅消息 更
阅读全文
react旧生命周期
摘要：render调用的时机 初始化渲染 状态更新之后 组件挂载完毕后调用componentDidMount 组件将要卸载之前，调用componentWillUnmount 组件的生命周期 组件从创建到死亡会经历一些特定的阶段 组件中包含一系列钩子函数，会在特定的时刻调用 我们在定义组件时，会在特定的生命
阅读全文
高阶函数和函数柯里化
摘要：高阶函数：如果一个函数符合下面2个规范中的任何一个，那该函数就是高阶函数 若A函数，接受的参数是一个函数，那么A就可以称之为高阶函数 若A函数，调用的返回值依然是一个函数，那么A就可以称之为高阶函数 函数的柯里化：通过函数调用继续返回函数的方式，实现多次接受参数最后统一处理的函数编码形式
阅读全文
react 中的事件处理
摘要：通过onXxx属性置顶事件处理函数，注意大小写， react重新封装了事件，不是使用原生的dom事件，因为为了更好的兼容性 react中的事件是通过事件委托方式处理的，委托给组件最外层的元素，因为为了更高效 可以通过event.target得到发生事件的dom元素对象，不要过度使用ref
阅读全文
组件三大核心属性1:state
摘要：state是组件对象最重要的属性，值式对象，可以包含多个key-value的组合 组件被称为状态机，通过更新组件的state来更新对应的页面显示 组件中的render方法中的this是组件实例对象 组件自定义的方法（绑定到事件）中this为undefined,如何解决？ 强制绑定this，通过函数对
阅读全文
ReactDOM.render 干了啥
摘要：ReactDOM.render(,document.getElementById('test')) 函数式组件 解析组件标签，找到了MyComponent组件 发现组件是使用函数定义的。随后调用该函数，将返回的虚拟dom转为真实dom，随后呈现在页面中。 类式组件 解析组件标签，找到了MyCompo
阅读全文
模块和组件，模块化和组件化
摘要：模块 向外界提供特定功能的js程序，一般就是一个js文件 为什么要拆成模块，随着业务逻辑增加，代码越来越多，越来越复杂 作用：复用js，简化js的编写，提高js运行效率 组件 用来实现局部功能效果的代码和资源的集合（html,css,js,image等） 为什么要用组件，一个界面的功能更复杂 作用：
阅读全文
js语句（js代码）和js表达式
摘要：j s表达式：一个表达式会产生一个值，可以放在任何一个需要值的地方 a a+b demo(1) arr.map() function test(){} js语句(js代码) if for switch(){case}
阅读全文
jsx语法规则
摘要：定义虚拟dom时，不要写引号 标签中混入js表达式时要用{} 样式的类名制定不要用class，要用className 内连样式，要用style={{key:value}}的形式去写 只有一个根标签 标签必须闭合 标签首字母，如果是小写字母开头，则将该标签转为html中同名元素，如果没有对应的，则报错
阅读全文
虚拟dom和真实dom
摘要：虚拟dom本质是object类型的对象 虚拟dom比较轻，真实dom比较重。因为虚拟dom只是在react内部在用，无需真实dom上那么多的属性。 虚拟dom最终会被react转化为真实dom，呈现在页面上。
阅读全文
react 简介
摘要：操作dom呈现页面 渲染数据为html界面的js库 原生js操作dom，繁琐效率低，DOM-API 操作UI 使用js直接操作dom，浏览器会进行大量的重绘重排 原生js没有组件化编码方案，代码复用率低 模块化，指的是js文件的复用。组件化，指的是，html，css，js在一起的复用。 react的
阅读全文
