![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 66
阿拉的梦想
这个作者很懒,什么都没留下…
展开
-
React Antd HelloWorld
react+antdesign 入门 helloword ,说明了如何安装和引入antd,如何使用antd的组件原创 2022-10-15 17:33:12 · 384 阅读 · 1 评论 -
【React】12.路由
在React中,是URL路径与组件的对应关系使用React路由简单来说,就是配置路径和组件的对应关系。原创 2022-09-12 21:26:33 · 519 阅读 · 0 评论 -
【React】11.高阶组件
【React】11.高阶组件高阶组件设置displayName高阶组件所谓高阶组件,时在原来的基础上进行一些加工,使组件的复用更方便高效;使用步骡创建一个函数,名称约定以with开头指定函数参数,参数应该以大写字母开头(作为要渲染的组件)在函数内部创建一个类组件,提供复用的状态逻辑代码,并返回在该组件中,渲染参数组件,同时将状态通过prop传递给参数组件调用该高阶组件,传入要增强的组件,通过返回值拿到增强后的组件,并将其渲染到页面中完整示例import React from 'rea原创 2022-05-22 19:29:28 · 335 阅读 · 0 评论 -
【React】10.render props 模式实现组件复用
【React】10.render props 模式简介:为了复用组件,形成了一种使用模式,就是render props模式,这个模式中显然要使用render 和 props。使用步骤:外部调用者向组件传入一个带返回值的函数如render2。组件的render直接调用这个函数,并用自己的state作为参数,render2的返回值作为render的返回值。这样,render2就可以自由使用组件的数据并自由渲染内容了。demo:一个实时获取鼠标坐标的组件import React from '原创 2022-05-22 17:55:22 · 249 阅读 · 0 评论 -
【React】9.组件的生命周期
【React】9.组件的生命周期组件的生命周期概述创建阶段更新阶段卸载阶段组件的生命周期概述意义:组件的生命周期有助于理解组件的运行方式、完成更复杂的组件功能、分析组件错误原因等組件的生命周期:组件从被创建到挂载到页面中运行,再到组件不用时卸载的过程生命周期的每个阶段总是伴随着一些方法调用,这些方法就是生命周期的钩子函数。钩子西数的作用:为开发人员在不同阶段操作组件提供了时机。只有类组件 才有生命周期。创建阶段执行顺序:更新阶段执行时机:setState()forceUpd原创 2022-05-18 21:45:25 · 212 阅读 · 0 评论 -
【React】8 props的children、校验、默认值
props.children 属性children 属性:表示组件标签的子节点。当组件标签有子节点时,props就会有该属性。chidren 属性与普通的props一样,值可以是任意值(文本、React元素、组件,甚至是函数)demo:import React from 'react'import ReactDOM from 'react-dom/client'//组件1class User extends React.Component { render() { r原创 2022-05-17 19:18:38 · 581 阅读 · 0 评论 -
【React】7.组件间的通讯
【React】7.组件间的通讯1. 父组件向子组件传递参数2. 子组件向父组件传递参数3. 兄弟组件传递参数)组件之间经常需要共享数据,传递数据,互相调用方法等操作。这时就需要使用组件间通讯的技术。包括父子组件通讯,兄弟组件通讯。1. 父组件向子组件传递参数这个很简单,分两步:父组件使用标签调用子组件时传入参数;子组件使用props获取传过来的参数。import React from 'react'import ReactDOM from 'react-dom/client'//父原创 2022-05-15 21:09:03 · 227 阅读 · 0 评论 -
【React】6.组件props的使用
【React】6.组件props的使用1. 简介2. 函数组件中的props3. 类组件中的props4. 进阶1. 可以给组件传递`任意类型`的数据2. props 是`只读`的对象,只能读取属性的值,无法修改对象3. 构造函数中使用props1. 简介组件是封闭的,要接收外部数据应该通过 props 来实现props的作用:接收传递给组件的数据传递数据:给组件标签添加属性接收数据:函数组件通过参数props接收数据,类组件通过 this.props 接收数据2. 函数组件中的props原创 2022-05-15 19:42:10 · 659 阅读 · 0 评论 -
【React】5.表单处理-受控组件
受控组件,非受控组件,表单事件绑定,解构赋值原创 2022-05-15 10:38:51 · 384 阅读 · 0 评论 -
【React】4.事件处理与类组件状态state
类组件状态state,事件绑定,this绑定原创 2022-05-14 21:17:16 · 348 阅读 · 0 评论 -
【React】3.组件基础
【React】组件基础1. 组件介绍2. React组件的两种创建方式2.1 通过函数创建组件2.2. 使用类创建组件3. 抽离为独立JS文件4. 事件处理4.1 事件绑定4.2.事件对象5. 组件状态6. 事件绑定this指向6.1 使用尖头函数绑定1. 组件介绍组件是React 的一等公民,使用 React 就是在用组件组件表示页面中的部分功能组合多个组件实现完整的页面功能特点:可复用、独立、可组合2. React组件的两种创建方式2.1 通过函数创建组件函数组件:使用 JS 的函原创 2022-05-14 21:13:15 · 147 阅读 · 0 评论 -
【React】2.JSX的使用
jsx介绍3. 基本使用4. 中使用javascript表达式5.条件渲染6.列表渲染6. 样式处理6.1 行内样式-style(不常用)6.2 CSS样式(推荐)原创 2022-05-14 16:45:04 · 209 阅读 · 0 评论 -
【react】1.使用vs code创建第一个react项目
1. 安装脚手架:sudo npm install -g create-react-app2. 初始化一个新项目:create-react-app demo13. 启动项目cd demo1npm start原创 2022-05-14 11:46:45 · 1773 阅读 · 0 评论