
react
胡鹤婷
努力靠近理性的工科产品胡
展开
-
React中pros和state的区别
props是一个父组件传递给子组件的数据流,这个数据流可以一直传递到子孙组件。state代表的是一个组件内部自身的状态(可以是父组件、子孙组件)。state 和 props 主要的区别在于 props 是不可变的,而 state 可以根据与用户交互来改变。其实这种说法有问题。可以参考一篇文章《React中state与props介绍与比较》 组件中的props本质作用是一种父级向子级传递数据的方式。转载 2017-12-31 23:12:25 · 1080 阅读 · 0 评论 -
React props和state
React基于状态实现对DOM的控制和渲染,组件状态分为两种:一种是组件间状态的传递,另一种是组件内部状态,这两种状态用props和state表示, props:用于从父组件到子组件的数据传递。 state:组件内部也有自己的状态,这些状态只能在组件内部修改数据流和PropsReact中的数据流是单向的,只会从父组件传递到子组件。属性props是父子组件间进行状态传递的接口,Rea...转载 2018-04-22 12:03:04 · 300 阅读 · 0 评论 -
React组件分类
React常见的组件分类方式: 1.函数组件,类组件 2.无状态组件,有状态组件 3.展示型组件和容器型组件函数组件和类组件函数组件(Functional Component)和类组件(Class Component),划分一标准是定义组件的方法。函数组件使用函数来定义组件,类组件使用ES6 class来定义组件。//函数组件function Welcome(props){...原创 2018-04-22 10:06:06 · 1028 阅读 · 0 评论 -
React源码分析-渲染篇
ReactJS和React-Native的区别React是由Facebook推出的一个JavaScript框架,主要用于前端开发。 React采用组件化的方式简化web开发 1.DOM:每个HTML页面可以看作为一个DOM 2.原生的web开发的方式。HTML一个文件,javascript一个文件,文件分开就会导致修改起来比较麻烦。 3.可以把一组相关的...转载 2018-04-14 16:07:30 · 926 阅读 · 0 评论 -
React组件生命周期
这是一篇我转载的文章,原文链接如下,再推荐有关React的几篇博客 原文:React组件生命周期小结 推荐: React 入门实例教程 【React Native】从源码一步一步解析它的实现原理 React 源码剖析系列 - 不可思议的 react diff简单的来说,React Component通过定义的几个函数来控制组件在生命周期的各个阶段的动作。 在ES6中,一个React...转载 2018-03-10 15:06:07 · 576 阅读 · 0 评论 -
getFieldValue取得值为undefined
代码如下:import { Form, Input, Button} from 'antd';const FormItem = Form.Item; class PCHeader extends React.Component { handleSubmit(e){ e.preventDefault(); var formData = this.prop原创 2018-01-19 14:39:03 · 12809 阅读 · 3 评论 -
CSS Modules
原文链接:阮一峰博客原文局部作用域CSS的规则都是全局的,任何一个组件的样式规则,都对整个页面有效。 产生局部作用域的唯一方法,就是使用一个独一无二的class的名字,不会与其他选择器重名。这就是 CSS Modules 的做法。下面是React一个组件App.jsimport React from 'react';import style from './App.css';转载 2018-01-18 12:46:02 · 269 阅读 · 0 评论 -
独立组件间的共享Mixins
使用Mixins实现不同组件之间的共享功能,共享代码ES6语法下使用Mixins需要安装插件react-mixinnpm install react-mixin --save应用举例: mixins.js文件const MixinLog = { log(){ console.log("我是xiaohujiazi"); }}export default Mi原创 2018-01-17 21:06:16 · 371 阅读 · 0 评论 -
React获取原生html节点方法
方法一export default class BodyIndex extends React.Component { changeUserInfo(age) { var button = document.getElementById('submitButton'); ReactDOM.findDOMNode(button).style.color = 'green';}rende原创 2018-01-17 20:36:58 · 5996 阅读 · 0 评论 -
React.PropTypes.number undefined
15.5.0版本之后,废除这个属性,需要单独引入prop-types这个包。npm install prop-types --save在组件中引入import PropTypes from ‘prop-types’ 在组件中使用: ComponentChild.propTypes = { age: PropTypes.number }原创 2018-01-17 18:33:21 · 795 阅读 · 0 评论 -
React诞生的历史原因
React诞生的原因React是Facebook开发的一款的JS库,那么Facebook为什么要创造React? Facebook认为MVC无法满足他们的扩展需求,由于他们非常巨大的代码库和庞大的组织,使得MVC很快变得复杂,每当需要添加一项新功能或者特性时,系统的复杂就成级数的增长,致使代码变得脆弱而不可预测,结果导致他们的MVC正在土崩瓦解。认为MVC不适合大规模的应用。当系统中有很多模...原创 2018-04-24 21:29:41 · 4170 阅读 · 0 评论