React Native
chichengjunma
这个作者很懒,什么都没留下…
展开
-
could not get batchedbridge, make sure your bundle is packaged correctly
之前项目还能正常运行,可是今天再去运行时报could not get batchedbridge, make sure your bundle is packaged correctly1原因:可能是你将之前安装并配置好的apk应用从手机卸载掉,然后重新安装运行,这时候的dev settings 被重置了。解决方案:运行react-native run-andr原创 2016-09-26 14:01:32 · 827 阅读 · 0 评论 -
React Native ListView 长按删除
项目中React Native ListView的长按删除功能分享:/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, {Component} from 'react';import { AppRegistry, Style原创 2016-11-25 09:57:38 · 3448 阅读 · 0 评论 -
React Native解决"libgnustl_shared.so" is 32-bit instead of 64-bit"报错问题
React Native项目在64位Android手机上运行,会提示"/data/data/com.xxx.xxx/lib-main/libgnustl_shared.so" is 32-bit instead of 64-bit 这个错误。解决方法就是取消掉所有的64位的.so文件,全部加载32位的就可以了,下面是步骤1.在项目的根目录的 gradle.properti原创 2016-12-22 15:36:32 · 8912 阅读 · 8 评论 -
更改React Native第三方组件源码
React Native常用第三方组件汇总见链接:http://blog.csdn.net/chichengjunma/article/details/52920137点击打开链接有时候第三方组件从样式上并不能如我们意愿,那我们如何更改React Native第三方组件的样式呢,下面以react-native-viewpager和react-native-checkbox第三方原创 2016-12-26 18:59:38 · 2617 阅读 · 0 评论 -
升级node与npm
低版本的npm在执行如下一句,终端会报错。npm install -g react-native-update-cli这时需要更新node和npm,Node.js的开发非常活跃,它的最新稳定版本也频繁变化。1. 检查 Node的当前版本,使用命令node -v 2. 清除npm cachesudo npm cache clean -f 3. 安装n模块sudo原创 2016-10-09 17:51:28 · 6645 阅读 · 0 评论 -
JS删除数组里的某个元素
删除数组指定的某个元素首先可以给JS的数组对象定义一个函数,用于查找指定的元素在数组中的位置,即索引,代码为:Array.prototype.indexOf = function(val) {for (var i = 0; i < this.length; i++) {if (this[i] == val) return i;}return -1;};然后使...原创 2017-01-01 16:38:25 · 35316 阅读 · 0 评论 -
React Native第三方组件优化精简
React Native常用第三方组件参考链接:http://blog.csdn.net/chichengjunma/article/details/52920137当我们使用这些github上引用的第三方组件时,经常会有作者的示例和readme 、gif图,这些也会copy到node_modules中,有些第三组件没有。这些打包进我们的Android IOS安装包会使之变大,所以要去原创 2017-01-19 09:33:55 · 955 阅读 · 0 评论 -
jenkins构建React Native Android项目
使用jenkins来实现自动化构建,可以简化开发测试的流程,原来debug包都不会做混淆,现在用了jenkins会自动的打混淆包,除了环境不一样,其他配置debug和release包都一样,这样就可以避免代码混淆带来的问题,早日发现早日治疗。推荐大家在废弃的电脑上搭建一个Jenkins。具体的搭建流程见这里这里介绍一下我在项目中使用了React-native之后的jenkins配置,默认已原创 2017-01-23 13:57:28 · 1983 阅读 · 0 评论 -
React/React Native 的ES5 ES6写法对照表
很多React/React Native的初学者都被ES6的问题迷惑:各路大神都建议我们直接学习ES6的语法(class Foo extends React.Component),然而网上搜到的很多教程和例子都是ES5版本的,所以很多人在学习的时候连照猫画虎都不知道怎么做。今天在此整理了一些ES5和ES6的写法对照表,希望大家以后读到ES5的代码,也能通过对照,在ES6下实现相同的功能。转载 2017-02-03 09:52:15 · 297 阅读 · 0 评论 -
ES6 变量的解构赋值
数组的解构赋值基本用法ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。以前,为变量赋值,只能直接指定值。let a = 1;let b = 2;let c = 3;ES6允许写成下面这样。let [a, b, c] = [1, 2, 3];上面代码表示,可以从数组中提取值,按照对应位转载 2017-03-03 15:12:13 · 454 阅读 · 0 评论 -
React Native倒计时
在开发电商相关的APP的时候,经常会有秒杀,团购的倒计时的需求,跟大家推荐一个开源的倒计时组件:github地址:https://github.com/jackuhan/react-native-CountDowntimer该组件只需要添加一个结束时间即可,非常方便,适用于商品秒杀页面等。效果图如下:示例代码:import CountDown from './Count原创 2017-03-28 09:50:34 · 2005 阅读 · 0 评论 -
React Native加密
1.简介 很多朋友在群里、论坛里问有没有非常好的MD5,AES,DES相关库,需要在React Native上面使用。其实做加密操作,加密标准都是统一的,直接有相关JavaScript库可以用来使用,今天给大家推荐一款前端加密库,直接安装就即可在React Native上面进行使用。常用的MD5,AES,SHA等等一系列的加密方法都已经封装好了。2.安装原创 2017-03-22 17:36:45 · 6703 阅读 · 1 评论 -
React Native小笔记
1.React Native 中如何实现根据state控制组件的显示与隐藏?render() { return( { this.state.abc == null ? ( null ) : (原创 2016-12-02 16:46:41 · 391 阅读 · 0 评论 -
React Native WebView自适应高度(Android、IOS平台通用)
系统自带的WebView控件在默认情况下,是不能自适应高度的,尤其在WebView嵌套在ListView中,WebView展现的是未知的HTML,又不能写死每个item的高度时,那么问题就来了,现将项目中用到的WebViewAutoHeight.js分享如下,可以直接拿来引用。(此程序不受制于HTML中的格式,不用和web端提前约定,minHeight的值不超过最大item值即可)...原创 2016-12-01 17:03:06 · 8528 阅读 · 23 评论 -
React Native Mac上搭建Android开发环境
前提预先安装了Android Studio和SDK API 23,提前准备:进入用户主目录下 $cd ~然后如果目录下不存在.bash_profile文件,则创建该文件$touch .bash_profile打开该文件$open .bash_profile接着在文件中加入以下两行,{/your/sdk/path/}是你的SDK文件夹的路径export A原创 2016-08-29 11:36:23 · 540 阅读 · 0 评论 -
React Native组件的生命周期
React Native中的component跟Android中的activity,fragment等一样,存在生命周期,下面先给出component的生命周期图getDefaultPropsobject getDefaultProps()执行过一次后,被创建的类会有缓存,映射的值会存在this.props,前提是这个prop不是父组件指定的 这翻译 2016-09-27 12:29:40 · 457 阅读 · 0 评论 -
原生代码中接入React Native
查阅网上资源和博客,全部是在原生的基础上一点一点的加文件实现使原生项目变成React Native项目,步骤较多,比较复杂,容易出现各种问题,对于项目不是很大,文件目录不是过于复杂的原生项目尝试利用先新建React Native项目,然后将原生代码集成进去的办法(基于Android平台、IOS类似)。一、打开现有项目利用Android Studio打开现有原生项目,如下图所示。原创 2016-11-07 14:10:36 · 1526 阅读 · 0 评论 -
React Native常见问题汇总(持续更新ing)
1.创建新项目,react-native init AwesomeProject命令长时间无响应,或报错shasum check failedreact-native命令行从npm官方源拖代码时会遇上麻烦。请将npm仓库源替换为国内镜像:npm config set registry https://registry.npm.taobao.org --globalnpm confi...原创 2016-10-27 10:14:14 · 23085 阅读 · 0 评论 -
Android Fragment Activity View中集成React Native页面
1.Activity private ReactRootView mReactRootView; private ReactInstanceManager mReactInstanceManager; protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInst原创 2016-11-08 11:39:38 · 2648 阅读 · 0 评论 -
React-Native学习指南
本指南汇集React-Native各类学习资源,给大家提供便利。指南正在不断的更新,大家有好的资源欢迎Pull Requests!同时还有Awesome React-Native系列https://github.com/jondot/awesome-react-native目录教程React NativeReact.jsES6系列教程开源APP组件工具资转载 2016-10-21 10:36:30 · 915 阅读 · 0 评论 -
React Native开发小结
1. 前言react-native开发使用的是JS,但是并不是纯正的JS,而是一种JSX语言,就是在JS中嵌入XML语言,因此,只要有一些JS的语法基础的原生开发者,就可以肯容易理解JSX的语法了,在RN中,推荐使用ES6的语法。对于JS而言,一切皆对象,函数也是对象,而对象的内部是通过key-value的形式来组成的,也可以说是通过json格式来组成。对象内部每一个键值对(key原创 2016-10-24 18:34:42 · 425 阅读 · 0 评论 -
React Native启动白屏问题
基于Android解决React Native项目启动时白屏问题一、 下载react-native-splash-screen在项目根目录打开终端运行npm react-native-splash-screen --save二、 安装(自动安装或手动安装)自动安装终端运行:react-native link react-native-splash-原创 2016-10-19 15:55:05 · 3741 阅读 · 0 评论 -
React Native底部导航react-native-tab-navigator
github上的地址:https://github.com/exponentjs/react-native-tab-navigator终端运行:npm install react-native-tab-navigator –save下载导入,类似安卓, import TabNavigator from 'react-native-tab-navigator';在render方法当中使用它:原创 2016-09-27 15:38:21 · 4967 阅读 · 2 评论 -
React Native调试插件
基于Chrome浏览器的React Native插件的安装与调试1.在github上下载插件,链接如下:https://github.com/facebook/react-devtools/releases 2.将后缀名为.crx的文件拖入Chrome浏览器react-devtools-0.14.6.crx 拖入Chrome浏览器3.手机选择Debug JS R原创 2016-09-01 10:24:25 · 3044 阅读 · 0 评论 -
React Native Sublime 中 Package Control 的安装与使用方法
Package Control 插件是一个方便 Sublime text 管理插件的插件,但因为 Sublime Text 3 更新了 Python 的函数,API不同了,导致基于 Python 开发的插件很多都不能工作,Package Control 原来的安装方法都失效了。网上有2种使用 Git 的安装方法,感觉太麻烦了。此处将 wbond 网站的 ST3 Package Contro转载 2016-08-30 17:29:33 · 493 阅读 · 0 评论 -
React Native 代码智能提醒WebStorm开发工具
在做React Native开发时,最常用的开发工具有 webStorm ,sublime ,appcode等,很多人都希望开发工具有智能提醒功能,然而我们使用上述开发工具进行React Native开发时并没有较好的提示功能。今天给大家介绍一款插件Webstrom live template 使webStrom支持React Native开发智能提醒。下面进入正题原创 2016-08-29 13:48:39 · 1009 阅读 · 0 评论 -
React Native常用第三方组件汇总--史上最全
React Native 项目常用第三方组件汇总:react-native-animatable 动画react-native-carousel 轮播react-native-countdown 倒计时react-native-device-info 设备信息react-native-fileupload 文件上传react-nati...原创 2016-10-25 11:28:13 · 44265 阅读 · 2 评论