props是常量不允许修改 React通过propTypes来设置参数类型。例: Person.propTypes = { name:PropTypes.string.isRequired,//限制为必传字段 age:PropTypes.number, sex: PropTypes.string,  ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-09-18 16:46:00
                            
                                1462阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            向路由组件传递参数			1.params参数						路由链接(携带参数):<Link to='/demo/test/tom/18'}>详情</Link>						注册路由(声明接收):<Route path="/demo/test/:name/:age" component={Test}/>						接收参数:this.props.match.params			2.search参数						路由链接(携带参数):<Link to='/demo/            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-07-16 14:59:29
                            
                                513阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            向路由组件传递参数			1.params参数						路由链接(携带参数):<Link to='/demo/test/tom/18'}>详情</Link>						注册路由(声明接收):<Route path="/demo/test/:name/:age" component={Test}/>            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-02-11 14:25:26
                            
                                599阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            其实react组件之间传递参数是比较简单的,组件传入参数的一种方式,参数作为组件的一个属性,在组件的的构造函数的props中就能看到这个属性对应的值            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-07-07 17:28:14
                            
                                514阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            前言今天群里面有很多都在问关于 React 组件之间是如何通信的问题,之前自己写的时候也遇到过这类问题。下面是我看到的一篇不错英文版的翻译,看过我博客的人都知道,我翻译可能不会按部就班,会尽可能用中文的意思,来将作者要讲述的技术描述清楚。英文能力有限,如果有不对的地方请跟我留言,一定修改……^_^原著序 处理 React 组件之间的交流方式,主要取决于组件之间的关系,然而这些关系的约定人就是你。我            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-10-25 09:15:17
                            
                                120阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            作用: 默认情况下必须经过路由匹配渲染的组件才存在this.props,才拥有路由参数,执行this.props.history.push('/detail')跳转到对应路由的页面,然而不是所有组件都直接与路由相连(通过路由跳转到此组件)的,当这些组件需要路由参数时,使用withRouter就可以给            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2020-03-27 17:02:00
                            
                                434阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            重新设计 React 组件库
诚身
7 个月前 在 react + redux 已经成为大部分前端项目底层架构的今天,让我们再次回到软件工程界一个永恒问题的探讨上来,那就是如何提升一个开发团队的开发效率? 从宏观的角度来讲,其实只有良好的抽象才能真正提高一个团队的开发效率,而囿于不同产品所面临的不同业务需求,当我们抽丝剥茧般地将一个个前端工程抽象到最后一层,那么剩下的其实就只有            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-08-26 10:07:51
                            
                                61阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            react的目的是将前端页面组件化,用状态机的思维模式去控制组件。组件和组件之间肯定是有关系得,通过合理得组件设计,给每一个组件划定合适得边界,可以有效降低当我们对页面进行重构时对其他组件之间得影响。同时也可以使我们得代码更加美观。1、高耦合低内聚。高耦合:将功能联系紧密得部分放到一个容器组件内对外暴漏出index.js,目录结构如下:├── components│ └── App└── inde            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-07-14 13:40:39
                            
                                117阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            react的使用需要安装的包npm install react
   npm install react-dom基本使用:在js中引入包import React from 'react'
  import ReactDOM from 'react-dom'使用react的createElement创建需要渲染的元素,使用createElement创建元素由三个参数,分别是:第一个参数,表示要创建的            
                
         
            
            
            
            tsconfig 常用配置项基于typescript的项目的根目录下都会有一个文件(tsconfig.json), 这个文件主要用来控制typescript编译器(tsc, typescript compiler)的一些行为, 比如指定哪些文件需要让tsc来编译, 哪些文件不想让tsc进行编译之类的。通常会配合eslint配置@typescript-eslint做代码检测。tsconfig的作用范            
                
         
            
            
            
            组件传参 多组件使用!            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-08-05 16:03:09
                            
                                220阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            实例 <div id="example"></div> <script type="text/babel"> function HelloMessage(props) { return <h1>Hello World!</h1>; } const element = <HelloMessage /> ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-06-23 00:49:00
                            
                                222阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            传递props import React, {Component, VFC, ReactNode } from 'react'; const Hello: VFC<{ body: ReactNode }> = ({ body }) => { return <div>{body}</div>; };            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2018-08-27 16:35:00
                            
                                717阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="js/react.js"></script> <script src="js/react-dom.js"></scrip            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2017-08-09 09:16:00
                            
                                159阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            原文链接:https://.newline.co/fullstack-react/30-days-of-react/day-3/ Let's revisit the "Hello world" app we introduced on day one <!DOCTYPE html> <html            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2020-02-24 16:50:00
                            
                                98阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            学习目标	了解组件模式	组件分类	类组件又称为动态组件,类组件中可自定义方法,一般有事件            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-06-27 11:20:35
                            
                                200阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            React 组件是构建 React 应用的基本单元。和。            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2024-10-14 09:47:14
                            
                                49阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            React组件 React组件介绍 组件是React的一等公民,使用React就是在用组件 组件表示页面中的部分功能 组合多个组件实现完整的页面功能 特点:可复用、独立、可组合 React组件的两种创建方式 使用函数创建组件 函数组件:使用JS的函数(或箭头函数)创建的组件 约定1:函数名称必须以大 ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-08-02 01:13:00
                            
                                202阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            React轻巧源于React组件的思想。就像没有函数的概念之前,计算一个长方形的面积,每次都是相同的计算长和宽的乘积,然后输出。React允许我们自定义组件,在以后的工作过程中,我们想渲染不同的组件,都可以自定义,通过render函数返回DOM元素节点。React组件示例:<!DOCTYPE html><html>  <head>    &...            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-07-28 09:50:19
                            
                                229阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            React 把组件看成是一个状态机(State Machines)。通过与用户的交互,实现不同状态,然后渲染 UI,让用户界面和数据保持一致。React 里,只需更新组件的 state,然后根据新的 state 重新渲染用户界面(不要操作 DOM)。以下实例创建一个名称扩展为 React.Component 的 ES6 类,在 render() 方法中使用 this.state 来修改当前的时间。            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-05-15 13:54:01
                            
                                59阅读
                            
                                                                             
                 
                
                                
                    