热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

react-native初步接触要点总结

写在前面的话,要用好react-native,必须要先了解es6和jsx,之后再开始react-native之旅目前用react-native已经有一个星期了,记录其中一些要点1、p

写在前面的话,要用好react-native,必须要先了解es6 和 jsx,之后再开始react-native之旅

目前用react-native已经有一个星期了,记录其中一些要点

1、props是只读的,唯一的修改时机为父渲染的时候,将新的props传递给子

2、定义自己的props的时候使用defaultProps才能指定默认值

3、定义自己的props的时候最好使用propTypes进行校验

4、state的更改将导致重新渲染

5、由于state的改变将导致重新渲染,因此在render中不能修改state,如果需要修改,一定是设计的问题

6、由于state的改变将导致重新渲染,因此了解控件的生命周期对于安全的改变state是十分重要的,控件的生命周期如下:


注:该图片来源于https://www.race604.com/react-native-component-lifecycle这篇文章

可以看出来,安全更新state的hook有componentWillMount,componentDidMount,

componentWillReceiveProps,shouldComponentUpdate

7、几个hook的常见应用场景

 a、componentWillMount:进入界面后进行一些初始化操作,比如表单通过服务器获取默认值。

 b、componentDidMount:进入界面后初始化或者调用一些其他框架,因为此时真实的dom已经创建。

 c、componentWillReceiveProps:渲染控件的时候,通过属性的变化修改state。      

 d、shouldComponentUpdate:父子通信,或者ref通信的时候,过滤不需要渲染的情况。也可以修改state。

e、componentWillUpdate:用来处理每次更新前需要做的事情,不能修改state。

 8、控件之间的通信

  a、利用父子及回调完成通信

 如果子需要向父通信,需要在子中定义一个回调函数,放在props中。整体思路如下


  b、通过ref进行通信

  使用this.refs.相应的控件ref属性值,即可取得相应的控件,进而可以调用setState,或者拿到props和state。

 两者的比较:

 最后举个例子说明一下为什么可能不被调用。假设父组件通过点击事件,重新渲染,同时改变子的props。

然而子是一个list,它的数量是不定的。比如一开始进入页面,list中有一个item,这个时候该item组件调用

componentWillMount和componentDidMount钩子函数。通过点击事件,假如这个时候list有三个item。那么第一个item

会走componentWillReceiveProps、shouldComponentUpdate、componentWillUpdate这组钩子函数。其他两个item

则是走componentWillMount和componentDidMount钩子函数。

也就是,父子通过props通信时,如果之前子有dom了,那么就走componentWillReceiveProps、

shouldComponentUpdate、componentWillUpdate这组钩子函数。否则走componentWillMount、

componentDidMount钩子函数。

这一点一定要注意。

  通过以上总结,可以灵活的处理任何交互。如果存在奇怪的现象,一定是思路不正确,而且没有理解透以上内容。











推荐阅读
  • 为了确保iOS应用能够安全地访问网站数据,本文介绍了如何在Nginx服务器上轻松配置CertBot以实现SSL证书的自动化管理。通过这一过程,可以确保应用始终使用HTTPS协议,从而提升数据传输的安全性和可靠性。文章详细阐述了配置步骤和常见问题的解决方法,帮助读者快速上手并成功部署SSL证书。 ... [详细]
  • 在iOS开发中,基于HTTPS协议的安全网络请求实现至关重要。HTTPS(全称:HyperText Transfer Protocol over Secure Socket Layer)是一种旨在提供安全通信的HTTP扩展,通过SSL/TLS加密技术确保数据传输的安全性和隐私性。本文将详细介绍如何在iOS应用中实现安全的HTTPS网络请求,包括证书验证、SSL握手过程以及常见安全问题的解决方法。 ... [详细]
  • Node.js 教程第五讲:深入解析 EventEmitter(事件监听与发射机制)
    本文将深入探讨 Node.js 中的 EventEmitter 模块,详细介绍其在事件监听与发射机制中的应用。内容涵盖事件驱动的基本概念、如何在 Node.js 中注册和触发自定义事件,以及 EventEmitter 的核心 API 和使用方法。通过本教程,读者将能够全面理解并熟练运用 EventEmitter 进行高效的事件处理。 ... [详细]
  • 在处理大规模数据数组时,优化分页组件对于提高页面加载速度和用户体验至关重要。本文探讨了如何通过高效的分页策略,减少数据渲染的负担,提升应用性能。具体方法包括懒加载、虚拟滚动和数据预取等技术,这些技术能够显著降低内存占用和提升响应速度。通过实际案例分析,展示了这些优化措施的有效性和可行性。 ... [详细]
  • 用阿里云的免费 SSL 证书让网站从 HTTP 换成 HTTPS
    HTTP协议是不加密传输数据的,也就是用户跟你的网站之间传递数据有可能在途中被截获,破解传递的真实内容,所以使用不加密的HTTP的网站是不 ... [详细]
  • Web开发框架概览:Java与JavaScript技术及框架综述
    Web开发涉及服务器端和客户端的协同工作。在服务器端,Java是一种优秀的编程语言,适用于构建各种功能模块,如通过Servlet实现特定服务。客户端则主要依赖HTML进行内容展示,同时借助JavaScript增强交互性和动态效果。此外,现代Web开发还广泛使用各种框架和库,如Spring Boot、React和Vue.js,以提高开发效率和应用性能。 ... [详细]
  • 深入解析:React与Webpack配置进阶指南(第二部分)
    在本篇进阶指南的第二部分中,我们将继续探讨 React 与 Webpack 的高级配置技巧。通过实际案例,我们将展示如何使用 React 和 Webpack 构建一个简单的 Todo 应用程序,具体包括 `TodoApp.js` 文件中的代码实现,如导入 React 和自定义组件 `TodoList`。此外,我们还将深入讲解 Webpack 配置文件的优化方法,以提升开发效率和应用性能。 ... [详细]
  • EST:西湖大学鞠峰组污水厂病原菌与土著反硝化细菌是多重抗生素耐药基因的活跃表达者...
    点击蓝字关注我们编译:祝新宇校稿:鞠峰、袁凌论文ID原名:PathogenicandIndigenousDenitrifyingBacte ... [详细]
  • 如何在服务器上配置SSL证书
    SSL证书是用于验证互联网上身份的一种数字凭证,通过启用HTTPS协议,确保用户与服务器之间的通信安全。本文将详细介绍如何在API和服务器上配置SSL证书,以提升网站的安全性和可信度。 ... [详细]
  • 字符串学习时间:1.5W(“W”周,下同)知识点checkliststrlen()函数的返回值是什么类型的?字 ... [详细]
  • 本文最初发表在Thorben Janssen的Java EE博客上,每周都会分享最新的Java新闻和动态。 ... [详细]
  • 网站访问全流程解析
    本文详细介绍了从用户在浏览器中输入一个域名(如www.yy.com)到页面完全展示的整个过程,包括DNS解析、TCP连接、请求响应等多个步骤。 ... [详细]
  • MySQL 5.7 学习指南:SQLyog 中的主键、列属性和数据类型
    本文介绍了 MySQL 5.7 中主键(Primary Key)和自增(Auto-Increment)的概念,以及如何在 SQLyog 中设置这些属性。同时,还探讨了数据类型的分类和选择,以及列属性的设置方法。 ... [详细]
  • Java高并发与多线程(二):线程的实现方式详解
    本文将深入探讨Java中线程的三种主要实现方式,包括继承Thread类、实现Runnable接口和实现Callable接口,并分析它们之间的异同及其应用场景。 ... [详细]
  • MySQL性能优化与调参指南【数据库管理】
    本文详细探讨了MySQL数据库的性能优化与参数调整技巧,旨在帮助数据库管理员和开发人员提升系统的运行效率。内容涵盖索引优化、查询优化、配置参数调整等方面,结合实际案例进行深入分析,提供实用的操作建议。此外,还介绍了常见的性能监控工具和方法,助力读者全面掌握MySQL性能优化的核心技能。 ... [详细]
author-avatar
不懂珍惜的林记热_713
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有