React Native

近日看到一篇文章 99%的程序都没有考虑的网络异常 ，开篇提到： > 绝大多数程序只考虑了接口正常工作的场景，而用户在使用我们的产品时遇到的各类异常，全都丢在看似 ok 的 try catch 中。如果没有做好异常的兼容和兜底处理，会极大的影响用户体验，严重的还会带来安全和资损风险。 于是，笔者分析了 GitHub 上的一些开源微信小程序，发现大多数的代码异常处理确实是不够的。 登录接口只考虑成功的情况，没考虑失败的情况 //调用登录接口 wx.login({ success: function() { wx.getUserInfo({ success: function(res) { that.globalData.userInfo = res.userInfo; typeof cb == "function" && cb(that.globalData.userInfo); } }); } }); 网络请求只考虑 then 不考虑 catch util.getData(index_api).then(function(data) { //this.setData({ // //}); console.log(data); }); 考虑了异常情况但是没有做妥善的处理 db.collection("config") .where({}) .get() .then(res => {

原文链接： https://facebook.github.io/react-native/blog/2019/09/18/version-0.61 快速刷新 在React Native的社区中关于最常见的痛点问题中，有一个最多的回答是“hot reloading”-热加载功能不能用了。在我们编写函数组件的时候不能正常工作，经常无法无法更新屏幕，也不能对拼写错误和错误做出正确的反映。因为这个功能不可靠，许多人都关闭了这个功能。 在ReactNative 0.61版本中，我们将现在的“Live Realod”和“Hot Relaoding”功能合并成了一个新功能叫“Fast Refresh”。Fast Refrsh是根据以下原则来重新实现的： Fast Refresh全面支持最新的React版本，包括函数组件和Hooks Fast Refresh在出现拼写错误和其他错误时能够正常好的恢复，并且在需要时可以回滚去重新全部加载 Fash Refresh不会对代码进行侵入性转换，因此可以放心的设置为默认打开。 下面是一个演示视频地址： Fast Refresh Video 下面是一些关于Fast Refresh的小提示： Fast Refresh默认会在函数式组件(和 Hooks)中保留React的当前状态 如果你需要每次编译都重置React State,你需要在文件中添加一个特殊的 //

1.生成离线bundle包 开发中了会知道RN项目的资源文件js css 字体图标 image是不在android or ios文件里面的, 离线包就是把 ReactNative 和你写的资源都打包放入 App . 首先在项目根目录创建文件夹: ./android/app/src/main/中创建文件夹assets 切换到项目根目录 运行指令 lph$ react-native bundle --entry-file index.js --platform android --dev false --bundle-output ./android/app/src/main/assets/index.android.bundle --assets-dest ./android/app/src/main/res/ 注意: react-native bundle --entry-file index.js 是因为我的项目(react-native ^0.55.1)入口文件为 index.js 而 0.49以前是index.android.js 2.生成签名文件 切换到 ./android/app/ 文件下 运行 $ keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA

Android精选源码 Android通用圆角布局源码 Android天气应用源码，界面美观 一个支持定制的树状 Android 自定义View PIN 码专用输入控件，支持任意长度和输入任意数据 Android实现日食加载动画效果 kotlin实现的Android Spannable API Android实现美团、饿了么首页分页导航菜单功能源码 Android一个方便可来处理可逆动画的效果 Android优质博客 跟上脚步，进入后台执行新时代 随着近几年来 Android 的不断发展，Google 逐步加强了对于后台执行的优化和限制。为了开发出现代化的 Android 应用，开发者需要学习如何通过最新方式来管理后台任务。系统如何判定应用处于后台？在理解后台执行这个概念之前，我们先来看看 Android 系统是如何定义前台应用的。当应用满足以下任意条件时，系统... 阅读原文 Android工程内嵌Flutter，跨平台的渐进式解决方案 其实2017年的时候就已经接触Flutter了，但也只是写了个HelloWorld，一方面是Flutter在那时候还只是preview版本，另一方面ReactNative在那时候非常火热，忙于用ReactNative重构项目，错过了入坑Flutter的第一梯队。在谷歌的2018IO大会上Flutter再一次成为了跨平台... 阅读原文 IT干货

语法 首先 React Native 所使用的语法是 JavaScript。 首推书籍是 JavaScript 高级程序设计（第3版）购书地址： http://item.jd.com/10951037.html 把本书的前 7 章看完，就能很好的了解 JS 的基础语法。不用看 BOM DOM 之后的章节，这块是针对游览器的。 React Native V0.18 之前采用的是 JavaScript 的 ECMAScript5 的标准，之后采用的是 ECMAScript6 (ES2016) 的标准，进行编程。 这部分要学习的是 ECMA2016 http://es6.ruanyifeng.com/ 主要的是 let和const命令 变量的结构赋值 Iterator和for..of循环 Class Module 这几章。 框架 以上是语法部分，接着我们知道，React Native 是基于 React 框架的搭建而成的。 通过官网学习 React 就好 https://facebook.github.io/react/index.h... 以上是基础部分，接着轮到我们的主角登场 React Native 官网就好，现在接口更新快，中文的文档难免不全。 React Native 官网 https://facebook.github.io/react-native/ 中文 http:/

https://segmentfault.com/a/1190000003915315 序 基于 雨点儿网 ，分享react-native开发android app的方法。 这篇博客旨在帮没有任何android或者ios开发经验的开发者体验一把当下热门的react-native。由于我之前也没有native app的开发经验，所以这篇文章中引用了很多我学习过程中碰到的简短有用的资料，方便大家少走些弯路。 我的开源项目托管在 github 。项目相关的具体内容，可参考下篇 《react-native项目结构介绍》 。本文只讨论react-native基本的概念及开发流程。 react-native介绍 直接去 官网 看,不用挂vpn。总而言之，这货就是用写web的方式去写原生应用。布局用css，代码用react的框架。而且不是hybrid app，所以体验很流畅。 关于更多react 及react-native的知识。可以参考 汇总知识 以及 知乎大牛 。 总而言之，如果要给app分类的话： webapp：移动端的web页面，纯浏览器应用。 native-app：Java或者oc、swift开发的app，用的本地的组件以及布局。 hybrid-app：介于以上两者之间。即有原生的组件，又封装了webview在里面以便渲染web组件。而这方面有很多框架，典型的如ionic。

作者：个推iOS工程师 伊泽瑞尔 一、背景 目前，移动开发技术主要分为原生开发和跨平台开发两种。其中，原生应用是指在某个特定的移动平台上，使用平台所支持的开发工具和语言，直接调用系统提供的API所开发的应用。 原生开发的主要优势体现在： 1.可以快速访问本平台的全部功能，比如摄像头、GPS等； 2.原生应用的速度快、性能高，而且可以实现比较复杂的动画和绘制效果，用户体验较好。 原生开发的缺点也很明显，主要体现在： 1.开发成本较高，不同的平台必须维护不同的代码，人力成本也会随之增加； 2.有新的功能需要更新时，只能进行版本升级。 随着移动互联网的高速发展，在很多的业务场景下，传统的纯原生开发已经不能满足日益增长的业务需求，主要表现在以下两个方面： 1.应用动态化的需求增大。当需求发生变化，或者是需要增加新的功能时，传统的纯原生应用开发只能通过版本的升级来更新内容，然而应用的上架和审核都需要一定的时间。因此，开发人员迫切地希望进行应用内容的更新时，可以不更新版本，提升工作效率。 2.业务需求变化快，开发成本变高。原生开发一般需要技术团队对iOS、Android两个开发平台进行维护。当版本更新迭代时，开发和测试的成本都会增加。 针对上述两个问题，跨平台框架应运而生。 二、跨平台技术简介 针对上文提到的原生开发所面临的问题，目前在IT界已经诞生了很多跨平台框架，主要分为三类： 1.H5

react-native 列表组件 react-native原有的listview因为性能的原因，逐步被SectionList和FlatList替换。 今天所有的演示的代码均可以通过 git 进行下载 ##生成一个Demo App 在进行学习之前我们需要通过React Native CLI来生成一个名为ListViewDemo的项目 首先我们需要安装CLI npm install -g react-native-cli react-native init ListViewDemo cd ListViewDemo 设置模拟数据 为了正真实的展示效果，我们抓取了网上的真实数据来进行模拟。因为数据量过大的原因，不在此页面展示，可以通过git进行下载。 获取数据 const BabyNameData = require('../data.json') let instance = null export default class BabyNameApi { //单例 constructor() { if (instance) { instance = this } return instance } getAllNames() { let names = [] BabyNameData.data.map((row) => { if (names.indexOf(row[10]

##00关系理解 这个是我对 RN 和原生关系的理解。简单解释下这个图。 RN js 编写完业务代码后，通过 react-native bundle 命令，将代码分别编译成一个 index.ios.bundle 和 index.android.bundle 文件，当然还是资源文件。然后放到 Android 、 iOS 的原生工程里，通过黄色说明块里的示例代码，将 js 写的所有逻辑业务读成一个 View 来展示在原生里，当然这个 View 需要 Activity/Fragment/ViewController 来承载。然后原生 App 打开相应承载的页面就可以看到 RN 写的业务了。所以，正常情况下，对于原生来说，所有的 RN 页面都是在一个原生页面里的。 顶部还有有个 node_modules ，它其实在工程里是一个文件夹，里面存放了所有的 js ， Android ， iOS 都需要的一个共同类库以及源码，所有的通信、组件都在这个里面。所以，三个工程里都需要读这个文件夹里的东西，但是我们不用关心具体，这个是由 npm 来自动下载的。只需要安装文档提示配置好这个文件夹的路径就ok了。 01性能问题 这里，我的理解是，性能一定不如纯原生写的。 关于RN写出来的应用的性能问题其实一直都是所有开发人员所关心的问题。 RN 一直说的是全都是调用的是原生的控件，所以理论上和原生写的 App

原文地址： https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#0580 本文由简书作者 凌宇之蓝 翻译,因本人水平有限，难免翻译有误，还望各位见谅。 ##[0.58.0] 欢迎阅读2019年1月发布的React Native。此版本有许多重大变化，我们特别提请您注意： 核心组件的流程类型的现代化和加强 中断对ScrollView，CameraRollView和SwipeableRow的更改，使其在某些方法中不再绑定到组件实例 支持WebKit中的相互TLS 从/ assets之外的目录提供的资产 针对意外行为的大量崩溃修复和解决方案 感谢那些对我们的发布候选人提供反馈的人。如果您有兴趣帮助评估我们的下一个版本，请在此处查看我们的跟踪问题。 ##新增 添加对publicPath的支持以启用来自不同位置的静态资产（0b31496 by @gdborton） ####Android 现在可以使用Android系统属性设置Bundler服务器主机，以便在多个应用程序或应用程序安装中更轻松地进行调试adb shell setprop metro.host（@stepanhruda的e02a154） Native Modules现在可以使用额外的属性（userInfo