前端框架_React
文章平均质量分 51
mango660
这个作者很懒,什么都没留下…
展开
-
React04_React Ajax4_消息订阅与发布
4.4 消息订阅-发布机制兄弟组件之间的通信github地址工具库 : PubSubJs下载 : npm install pubsub-js --save使用:-- 引入import PubSub from 'pubsub-js'-- 订阅this.token = PubSub.subscribe('delete', function(data){})-- 发布消息PubSub.publish('delete',data)-- 取消订阅PubSub.unsubscrib原创 2021-08-01 11:13:11 · 80 阅读 · 0 评论 -
React05_React-Router
5 react-router5.1 相关理解SPA的理解:单页Web应用(single page web application, SPA)整个页面只有一个完整的页面点击页面中的连接不会刷新页面,只做页面的局部更新数据都需要通过ajax请求获取,在前端异步展现路由的理解什么是路由一个路由就是一个映射关系{key : value}key 为路径, value 可能是 function 或 component路由的分类后端路由理解:value 是 function,翻译 2021-08-01 10:33:36 · 240 阅读 · 0 评论 -
React02_组件生命周期5
2.7 组件生命周期效果理解组件对象从创建到死亡会经历特定阶段、React 组件对象包含一系列钩子函数(生命周期回调函数),在特定的时刻调用。我们在定义组件时,在特定的生命周期回调函数中做特定的工作。组件生命周期(旧)初始化阶段:由ReactDOM.render()触发 — 初次渲染constructor()componentWillMount()render()componentDidMount()一般在这个钩子做一些初始化的事,例如:开启定时器原创 2021-08-01 09:44:40 · 125 阅读 · 0 评论 -
React02_函数的柯里化与高阶函数4
2.6 高阶函数_函数柯里化高阶函数:如果一个函数符合下面2个规范中的任何一个,那该函数就是高阶函数1. 若A函数,接受的参数是一个函数,那么A就可以成为高阶函数2. 若A函数,调用的返回值依然是一个函数,那么A就可以称之为高阶函数3. 常见的高阶函数:Promise、setTimeout、arr.map()函数的柯里化:通过函数调用继续返回函数的方式,实现多次接收参数最后统一处理的函数编码形式。// 保存表单数据到状态中saveFormData = (dataType)=>{原创 2021-08-01 09:16:17 · 65 阅读 · 0 评论 -
React02_收集表单数据3_受控组件与非受控组件
2.5 收集表单数据效果定义一个包含表单的组件,输入用户名和密码之后,点击登录有弹框提示// 创建组件class Login extends React.Component{ showInfo = (event)=>{ // 阻止表单的提交 event.preventDefault(); const {username, password} = this; alert(`你输入的的用户名是${username.va原创 2021-08-01 09:11:51 · 67 阅读 · 0 评论 -
React02_面向组件编程2.3_组件实例的三大核心属性_refs
2.4 组件实例的三大核心属性3:refs与事件处理效果理解组件内的标签可以定义ref属性来标识自己编码字符串形式的ref <input ref="input1" />回调形式的ref<input ref={(c)=>{this.input1 = c}} />如果ref回调函数是以内联函数的方式定义的,在更新过程中它会被执行两次,第一次传入参数null, 然后第二次会传入DOM元素。这是一位内在每次渲染时会创建一个新的函数实例,所原创 2021-07-29 11:31:40 · 69 阅读 · 0 评论 -
React02_面向组件编程2.2_组件实例的三大核心属性_props
2.3 组件实例的三大核心属性2: props效果需求:自定义用来显示一个人员信息的组件 // 1. 创建组件 class Person extends React.Component{ render (){ const {name, age, sex} = this.props; // props是只读的 return ( <ul> <li&原创 2021-07-29 10:38:35 · 70 阅读 · 0 评论 -
React02_面向组件编程2.1_组件实例的三大核心属性_state
2.2 组件实例的三大核心属性1: state详细版// 1. 创建组件class Weather extends React.Component{ // 构造器调用几次? —— 几个Weather实例,调用几次 1 constructor(props) { console.log('constructor'); super(props); // 初始化状态 this.state = { i原创 2021-07-29 10:24:09 · 57 阅读 · 0 评论 -
React02_面向组件编程1_函数式组件_类式组件
2 面向组件编程2.1 两类组件1. 函数式组件——适用于简单组件简单组件——无state// 1. 创建函数式组件——首字母大写function Demo(){ console.log(this); // undefined // babel翻译完开启严格模式,所以为 undefined return <h2>我是用函数定义的组件(适用于简单组件的定义)</h2>}// 函数调用: Demo()// 2. 渲染组件到页面——react调原创 2021-07-29 10:10:34 · 80 阅读 · 0 评论 -
react脚手架配置代理总结
react脚手架配置代理总结方法一在package.json中追加如下配置"proxy":"http://localhost:5000"说明:优点:配置简单,前端请求资源时可以不加任何前缀。缺点:不能配置多个代理。工作方式:上述方式配置代理,当请求了3000不存在的资源时,那么该请求会转发给5000 (优先匹配前端资源)方法二第一步:创建代理配置文件在src下创建配置文件:src/setupProxy.js编写setupProxy.js配置具体代理规则:const翻译 2021-07-22 16:55:13 · 49 阅读 · 0 评论 -
React01_入门
React文章目录React1 React入门1.1 React简介1.2 React基本使用1.3 JSX1.3_补充1.4 模块与组件、模块化与组件化的理解是什么?用于构建用户界面的JavaScript库- 发送请求获取数据- 处理数据- 操作DOM呈现页面(react自行处理)是一个将数据渲染为HTML视图的开源JavaScript库谁开发的?由Facebook开发,且开源。Instagram???为什么要学?原生JavaScript操作DOM繁琐、效原创 2021-07-18 21:31:11 · 88 阅读 · 2 评论