加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

react-native初探

发布时间:2020-12-15 04:46:57 所属栏目:百科 来源:网络整理
导读:react-native初探 1.简介 react-native是在react基础上推出来的使用js写原生iOS和Android页面的开源框架,许多语法和思想都是基于React,一开始学习RN直接上来就看RN的文档和例子,发现有很多东西都看得一知半解,后来仔细看了React的文档后才明白,许多东西

react-native初探

1.简介

react-native是在react基础上推出来的使用js写原生iOS和Android页面的开源框架,许多语法和思想都是基于React,一开始学习RN直接上来就看RN的文档和例子,发现有很多东西都看得一知半解,后来仔细看了React的文档后才明白,许多东西在React写了React-native文档就没有说,所以十分建议先看React。看完React,其实React-Native也就差不多理解了,RN只不过是把web的View换成native的View。

2.start

  1. 首先使用 ruby -e “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)”安装HomeBrew
  2. 然后用brew install nvm 安装nvm
  3. 使用nvm install node && nvm alias default node 安装node
  4. ps:官网说的watchman和flow貌似可以不用安装

3.几个重点需要理解的地方

React在内存中维护一个快速响应的DOM描述。通过render()方法返回一个DOM的描述。DOM编写React页面主要有以下几个注意的点:

3.1.react提供了几个生命周期函数:

挂载: 组件被插入到DOM中。
更新: 组件被重新渲染,查明DOM是否应该刷新。
移除: 组件从DOM中移除。

挂载

getInitialState(): object在组件被挂载之前调用。状态化的组件应该实现这个方法,返回初始的state数据。之后在其他地方可以使用this.state.xxx来访问这个参数
componentWillMount()在挂载发生之前立即被调用。
componentDidMount()在挂载结束之后马上被调用。需要DOM节点的初始化操作应该放在这里。

更新

componentWillReceiveProps(object nextProps)当一个挂载的组件接收到新的props的时候被调用。该方法应该用于比较this.props和nextProps,然后使用this.setState()来改变state。
shouldComponentUpdate(object nextProps,object nextState): boolean当组件做出是否要更新DOM的决定的时候被调用。实现该函数,优化this.props和nextProps,以及this.state和nextState的比较,如果不需要React更新DOM,则返回false。
componentWillUpdate(object nextProps,object nextState)在更新发生之前被调用。你可以在这里调用this.setState()。
componentDidUpdate(object prevProps,object prevState)在更新发生之后调用。

移除

componentWillUnmount()在组件移除和销毁之前被调用。清理工作应该放在这里。

3.2.两个变量:

this.statethis.propsthis.state变量在getInitialState()函数里设置,而this.props通过父控件的调用传递到子控件,fackbook建议最好所有的数据都从父级而来,结构能更加清晰。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读