React笔记（更新）

Posted 2020-09-20 代码笔

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元素上，且虽然截取了文字但是还是会占用空间