![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
林间风雨
一名积极前进的软件工程师
展开
-
vue 生命周期图 和 react 生命周期图
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------..原创 2021-04-12 17:54:49 · 55 阅读 · 0 评论 -
将Antd 的日期选择框里面的文字改为中文
// 以下4行引入解决日期控件英文的问题import moment from 'moment'import locale from 'antd/lib/date-picker/locale/zh_CN'import 'moment/locale/zh-cn'moment.locale('zh-cn')<RangePicker style={{ width: '306px' }} locale={locale} onChange={this.handleChange.bin.原创 2020-12-19 17:50:43 · 643 阅读 · 2 评论 -
react eslint解决方案整理
eslint 解决方案整理最近在处理react项目中报的warning,进行了以下整理参考文档http://eslint.cn/docs/rules/项目中遇到warning的解决$ xxx is defined but never used no-unused-vars禁止出现未使用过的变量删除$ Expected '===' and instead saw '==' eqeqeq要求使用 === 和 !====变===$ img elements must have an al.原创 2020-12-01 18:12:51 · 1400 阅读 · 0 评论 -
react笔记积累
10、9、8、7、6、5、4、3、点击事件:onClick={(e)=>this.changeFarmBase("全部",0)}//基地选中变色changeFarmBase=(val:string,num:number)=>{this.setState({farmBase:val,farmBaseNum:num,});...原创 2020-12-01 10:22:53 · 108 阅读 · 0 评论 -
react 中组件的生命周期 - 详解
原创 2020-11-30 16:55:22 · 54 阅读 · 0 评论 -
react 点击弹窗之外关闭弹窗 demo
最近做一个需求,想要点击空白的地方关闭弹窗,网上找了好久,没有一个能用的,后面用ref实现了,记录一下原理就是用ref来获取DOM元素,进行比对,如果被点击的event是弹窗本身或者包含弹窗,就不处理,如果弹窗之外的区域,就关闭react 的实现demo如下:interface IDemoState { open: boolean;} class Demo extends React.Component<{}, IDemoState> { public inpu原创 2020-11-30 16:38:24 · 3997 阅读 · 0 评论 -
react 实现点其他地方一个弹框关闭
当我们点击更多时候,页面出现一个弹层,点击叉叉,再次点击更多或者点击其中某个城市,这个弹层都会消失,但是现在我们希望点击页面其他任意区域弹层也会消失,为此,我们使用react实现它。首先我们在react的生命周期函数中增加监听器,给整个页面最顶级(window)增加一个点击事件处理函数componentDidMount() { window.addEventListener('mouseup', this.handleMouseUp, false) } componentWill原创 2020-11-30 16:18:40 · 2577 阅读 · 0 评论 -
react 父传子,子传父
父:importReactfrom"react";importSon from'./son';classFather extendsReact.Component{state={content:true};makeMoney=(val:boolean)=>{console.log(val)this.setState({cameraVisible:val,});};...原创 2020-11-24 18:20:31 · 206 阅读 · 0 评论 -
win10 yarn : 无法加载文件 C:\Users\Admin\AppData\Roaming\npm\yarn.ps1,因为在此系统上禁止运行脚本
管理员用PowerShell运行 set-ExecutionPolicy RemoteSigned可以不用管理员就行了原创 2020-11-16 11:41:58 · 1052 阅读 · 0 评论 -
React Developer Tools 下载
https://github.com/facebook/react-devtools原创 2020-11-11 10:25:08 · 262 阅读 · 0 评论 -
react 父组件传值子组件,子组件传值孙组件
import React from 'react'import ReactTypes from 'prop-types'/* // 最外层的父组件export default class Com1 extends React.Component { constructor(props) { super(props) this.state = { color: 'red' } } render() { return <div>.原创 2020-11-10 15:30:32 · 600 阅读 · 0 评论 -
React 注意内容,React 补充学习
6、5、const element = <HelloMessage />为用户自定义的组件。注意,原生 HTML 元素名以小写字母开头,而自定义的 React 类名以大写字母开头,比如 HelloMessage 不能写成 helloMessage。除此之外还需要注意组件类只能包含一个顶层标签,否则也会报错。4、注释需要写在花括号中 {/*注释...*/}3、React 推荐使用内联样式。我们可以使用camelCase语法来设置内联样式....原创 2020-10-25 17:47:24 · 155 阅读 · 0 评论