react
碑无名
这个作者很懒,什么都没留下…
展开
-
react高阶组件
/* 高阶组件 */import img from './image/1.jpg'function withMouse(WrappedComponent){ class Mouse extends React.Component{ state={ x:0, y:0 } handleMouse=e=>{ this.setState({ x:e.clie..原创 2022-03-10 18:41:46 · 131 阅读 · 0 评论 -
react中的props校验
/* props约束规则 */import PropTypes from 'prop-types'const App=props=>{ return( <div> <h1>prop校验:</h1> </div> )}/* 属性a的类型 数值(number) 属性fn的类型 函数(func并且为必填项 属性tag的实现 React元素(element) 属性fil.原创 2022-03-09 20:23:49 · 435 阅读 · 0 评论 -
react的父子通信、子父通信、兄弟通信
// 父传子class Parent extends React.Component{state={ name:"zx"}render(){ return ( <div className='parent'> 父组件: <Child name={this.state.name}></Child> </div> )}}const Child=(props)=>{ console.log(".原创 2022-03-09 19:24:33 · 277 阅读 · 0 评论 -
react的组件的props
// // props接收数据(函数)// const Hello=props=>{// console.log(props);// return(// <div>// <h1>props:name:{props.name} age:{props.age}</h1>// </div>// )// }// ReactDOM.render(<Hello name="zx" age={19}&g.原创 2022-03-08 20:22:15 · 449 阅读 · 0 评论 -
react类创建组件和函数创建组件
//函数组件------1、开头一定要大写命名2、一定要有返回值// function Hello(){// return(// <div>这是我第一个函数组件</div>// )// }// ReactDOM.render(<Hello></Hello>,document.getElementById('root'))// 创建类组件class Hello extends React.Component{原创 2022-03-07 21:21:08 · 345 阅读 · 0 评论 -
react基本使用
首先下载react和它的domnpm i react react-domreact在vscode是没有提示的需要下载插件可以参考其他博客<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" c原创 2022-03-07 19:30:45 · 141 阅读 · 0 评论