React笔记(更新)

Posted 代码笔

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了React笔记(更新)相关的知识,希望对你有一定的参考价值。

React:

1,React.render 是 React 的最基本方法,用于将模板转为 html 语言,并插入指定的 DOM 节点

2,React.createClass 方法就用于生成一个组件类

3,this.props 对象的属性与组件的属性一一对应  this.props.children 属性表示组件的所有子节点

4,React.findDOMNode 从组件获取真实 DOM 的节点

5,this.state 读取组件的方法  this.setState 设置组件的方法

6,this.props 表示那些一旦定义,就不再改变的特性,而 this.state 是会随着用户互动而产生变化的特性

7,event.target.value 读取用户输入的值

8,style={{display: ‘none‘}}

9,props 从父节点传递到子节点的数据

10,getInitialState()在组件的生命周期中仅执行一次,设置组件的初始化状态

11,componentDidMount是一个在组件被渲染的时候React自动调用的方法

12,利用Ref属性给子组件命名,this.refs引用组件。在组件上调用getDOMNode()获取浏览器本地的DOM元素

13,row(横向伸缩)和column(纵向伸缩)

14,react 宽度基于pt为单位, 可以通过Dimensions 来获取宽高,PixelRatio 获取密度

15, view默认宽度为100%    

  水平居中用alignItems, 垂直居中用justifyContent     

  基于flex能够实现现有的网格系统需求,且网格能够各种嵌套无bug

16, 通过Image.resizeMode来适配图片布局,包括contain, cover, stretch

  默认不设置模式等于cover模式

  contain模式自适应宽高,给出高度值即可

  cover铺满容器,但是会做截取

        stretch铺满容器,拉伸

17, 定位相对于父元素,父元素不用设置position也行

  padding 设置在Text元素上的时候会存在bug。所有padding变成了marginBottom

18, 文字必须放在Text元素里边

  Text元素可以相互嵌套,且存在样式继承关系

  numberOfLines 需要放在最外层的Text元素上,且虽然截取了文字但是还是会占用空间

 

 
 

以上是关于React笔记(更新)的主要内容,如果未能解决你的问题,请参考以下文章

React 学习笔记总结

egg.js + react 实战:从 0 到 1 实现记账本小册学习笔记合集(持续更新中)

React学习笔记3

Vue笔记(Vue生命周期 11个钩子)

React笔记一

React Native笔记