自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(209)
  • 收藏
  • 关注

转载 Redux 17 - 进阶:和React Router一起使用(Usage with React Router)

原文http://testudy.cc/tech/2017/04/29/redux-17-advanced-UsageWithReactRouter.html?utm_source=tuicool&utm_medium=referralSo you want to do routing with your Redux app. You can use it with React

2017-04-29 08:44:00 2338

转载 RN-开源项目24个

原文地址一react-native-eyepetizer模仿“开眼”APPhttps://github.com/MarnoDev/react-native-eyepetizer二GitHub Popular这是一个用来查看GitHub最受欢迎与最热项目的App,它基于React Native支持Android和iOS双平台http

2017-04-28 16:08:21 2586

转载 React全家桶写一个CNode社区

webpack2+react+react-router+react-redux+ES6+antd-mobile版本的Cnodehttps://juejin.im/post/5902c98fda2f60005def88a2?utm_source=tuicool&utm_medium=referral苦于我就职的公司的技术栈还是ES5+jQ+handelbars,而我一直对React全

2017-04-28 16:06:42 3618

原创 官方推荐react-navigation的使用

看了官方文档的导航器对比,发现现在主推的方案是一个单独的导航库react-navigation,据说它的使用十分简单。我就写个demo,试了一下。一、主要构成按使用形式主要分三部分:1 StackNavigator: 类似于普通的Navigator,屏幕上方导航栏2 TabNavigator: 相当于ios里面的TabBarController,屏幕下方的标签栏3 Dr

2017-04-27 17:29:42 23541

原创 官方推荐react-navigation的使用

看了官方文档的导航器对比,发现现在主推的方案是一个单独的导航库react-navigation,据说它的使用十分简单。我就写个demo,试了一下。一、主要构成按使用形式主要分三部分:1 StackNavigator: 类似于普通的Navigator,屏幕上方导航栏2 TabNavigator: 相当于ios里面的TabBarController,屏幕下方的标签栏3 Dr

2017-04-27 17:08:52 1864

转载 关于React-native里Android原生模块和组件的写法

原生模块就是把Android里的API导出来给JS调用,说简单一点,就是让自己写的Java函数能够在React Native的js代码里调用。比如一些实现高性能的、多线程的代码,还有譬如图片处理、数据库、或者各种高级扩展等等。 http://blog.youkuaiyun.com/black_dreamer/article/details/51902187举个栗子: Toast模块: 1、继承

2017-04-26 12:26:20 1018

转载 RN-性能优化 (四)

前人种树后人乘凉原文地址一、优化Component很多人在定义一个class时都会去继承Component,这并没有错,但是如果一个子组建也继承了Component,那么当父组建render时也会导致子组建的render,怎么解决呢?其实很简单只需要我们的子组建去继承PureComponent即可。个人建议自定义的class都可以去继承PureComponent从而避免不必

2017-04-25 18:51:11 1182

转载 RN-性能优化 (三)

前人种树后人乘凉原文地址你需要了解什么是帧在你的祖父辈,它们一般把视频称为”移动的图片”的一个原因是:视频中逼真的动作是以固定的速度,快速改变静态的图片创造出来一个错觉。这里的每一个图片就一个是帧。每一秒中图片的数量(帧),它直接影响了视频的真时性(或者app中的用户界面). iOS的设备是每秒60帧。它也就给了你以及UI系统大约16.67毫秒的时间,来完成生成一张静态图片

2017-04-25 18:50:43 1152

转载 RN-性能优化 (二)

前人种树后人乘凉原文地址自从React Native出世,虽然官方一直尽可能的优化其性能,为了能让其媲美原生App的速度,但是现实感觉有点不尽人意。接下来介绍下实践中遇到的一些性能问题以及优化方案。以下对性能参数的依据是来自于React Native自带的FPS Monitor.一、Navigator页面切换动画优化场景: 在Navigator还没出来时,导航器是由

2017-04-25 18:50:06 3048

转载 RN-性能优化 (一)

前人种树后人乘凉http://www.jianshu.com/p/11f38925f5ad原文地址一、异步逐层渲染。React Native 虽然一直标榜媲美Native的体验,但实际使用下来,其渲染性还是非常低效,基于ScrollView和ListView两大容器,在渲染上,相当于web端的table布局,需要等整个大table渲染完成才显示页面,也就是说,当容器内有大量

2017-04-25 18:49:37 1247

转载 ReactNative实现通知监听事件

事例1:只在rn里面发送和接受消息。A界面:import {DeviceEventEmitter} from 'react-native';//...componentDidMount(){ this.subscription = DeviceEventEmitter.addListener('xxxName’, Function);};compo

2017-04-25 14:12:23 4639

转载 React-Native 通知的使用方法

1.首先在页面顶部引入DeviceEventEmitter http://www.jianshu.com/p/d3acea15177b2.添加通知DeviceEventEmitter3.移除DeviceEventEmitter4.在任意页面发起通知 即可唤起接到通知后的触发方法         

2017-04-25 14:00:07 6177 1

转载 React-Native 打包发布

1.将你的密钥复制到  android/app 目录下.2.在android/gradle.properties文件中添加如下配置。MYAPP_RELEASE_STORE_FILE=你的密钥名称MYAPP_RELEASE_KEY_ALIAS=你的密钥别名MYAPP_RELEASE_STORE_PASSWORD=密钥密码MYAPP_RELEAS

2017-04-25 13:26:47 678

转载 react-native-image-picker在iOS上闪退的解决办法

最近做项目用到了react-native-image-picker这个图片选择的第三方库,但在正确配置的情况下,点击选择相册会遇到闪退的问题,凭借开发原生的经验,找到了问题所在,在这里分享一下解决办法。http://www.jianshu.com/p/977bc5eea1b1?utm_source=tuicool&utm_medium=referralreact-nat

2017-04-25 12:32:02 3817 1

转载 React Native (五):上下拉刷新加载

1.下拉刷新下拉刷新我们使用 React Native 提供的组件 RefreshControl,去 NewsList.js 的 ListView添加:原文链接:http://www.jianshu.com/p/b1e4e12fc762<ListView style={{flex:1, backgroundColor:'white'}} dataSource={

2017-04-24 18:42:13 675

转载 微信小程序版QQ音乐

来源实例源码http://www.see-source.com/weixinwidget/detail.html?wid=161微信小程序版QQ音乐--源自QQ音乐h5歌词来源-showapi已做 [推荐] [排行榜] [搜索] [热门歌单] [播放列表] [歌词]todo

2017-04-24 17:50:53 5715

转载 React-Native 之 redux 与 react-redux

前言原文链接(http://www.jianshu.com/p/2a327a235f2d)本文 有配套视频,可以酌情观看。文中内容因各人理解不同,可能会有所偏差,欢迎朋友们联系我讨论。文中所有内容仅供学习交流之用,不可用于商业用途,如因此引起的相关法律法规责任,与我无关,如文中内容对您造成不便,烦请联系 277511806@qq.com 处理,谢谢。转载麻烦注明出处,谢谢。

2017-04-24 16:42:11 530

转载 ReactNative基于CodePush实现热更新集成详解

[TOC]参考 React Native中文官网(V0.42)安装工具介绍根据最新的官方文档和实际集成经验整理 http://www.jianshu.com/p/54cd13ed9e95工具名称描述备注ChocolateyWindows上的包管理器(需翻墙)通常不安装,使用 npm 即可

2017-04-24 16:19:14 1627

转载 React Native 与 原生交互

React Native 与 原生交互http://www.jianshu.com/p/41dd77a83c13React Native 与原生交互一般有三种方式,分别是Callback,Promise,RCTDeviceEventEmitter本文所有代码片段基于React Native"react": "16.0.0-alpha.6","react-nat

2017-04-24 13:46:37 1626

转载 基于 React Native 的开源项目

码云教学Android Studio 中的项目上传到码云上https://my.oschina.net/gitosc/blog/885589?utm_source=tuicool&utm_medium=referral作者:@hjqjl一、首先下载git,并安装http://git-scm.com/downloads/二、在 studio 的 File - Sett

2017-04-24 09:09:47 1747

转载 关于解决android studio出现Error:Execution failed for task ':app:mergeDebugResources'. 的方法

今天从eclipse导入项目到Android studio时出现了这个问题Error:Execution failed for task ':app:mergeDebugResources'. > Crunching Cruncher scrollbar_thumb.9.png failed, see logs错误内容如下图所示:问题一:可能是图

2017-04-24 06:48:04 5496

转载 android studio报错Error:Project with path 'XXXX' could not be found解决办法

刚从服务器上剪下来的工程编译死活报 project with path '... ' could not be found in project ' app' 这个错,找不到依赖库,可是检查工程里面有这个呀,一开始想着是不是主Module 的配置有问题,可是没有任何问题,最后问题终于找到了,原来在setting.gradle这个配置文件里面少了依赖工程的配置信息,添加以后rebui

2017-04-24 06:20:33 32264

转载 学习总结 ~ (三)React Native 初学 之 sectionList

目的今天我要实现一个 类似于 iOS 开发中带有分组的colllectionView 样式的布局, 每个section都要有个组头。http://www.jianshu.com/p/6302c4d48b97首先我们要先决定要使用什么控件。ScrollView和ListView/FlatList还有SectionList都是可以选择的。ScrollView 会把所有子

2017-04-24 05:42:09 992

转载 React native全局变量的使用(跨组件的通信)

RN中有两种方式使用全局变量1.通过导入导出文件的方式新建constants.js文件const object = { website:'http://www.hao123.com', name:'好123',};export default object;需要用到的时候导入文件import constants from './constansts.js'

2017-04-24 05:40:19 18906 1

转载 react native集成到原有的项目中(iOS)

接触RN也有一段时间了,基本上来说算是入门了,到目前RN的应用还没有达到期望的广泛度,大部分还是以原生+RN的方式进行混合开发,今天抽空写一下关于RN嵌入到iOS原生项目中的知识点。http://www.jianshu.com/p/0e830adc4c90前期准备现在大部分嵌入方式都是采用cocoapods的方式引入RN依赖库到原生项目中,当然你也可以选择手动方式,不过很麻烦,本文

2017-04-24 05:38:47 1991

转载 react native实战

项目的react native 版本react-native-cli: 2.0.1react-native: 0.39.2用react native + react-redux写的一个demo后续还会继续优化,添加router、webpack等http://www.jianshu.com/p/c667ebdd6a9a效果图如下效果图

2017-04-24 05:37:56 823

转载 React Native打包代码解析与拆分Bundle做法

本文的RN代码基于0.43版本  https://blog.desmondyao.com/rn-split/一般应用React Native(RN)后,随着使用页面的增加,bundle包(携带资源)会逐渐加大,这会带来以下两个缺点:页面启动速度&内存占用增加 这是不言而喻的,一个页面启动时会加载其他无关页面的代码,自然会有内存占用加大、启动时间增加的问题,这部分的消耗是不应该的。更

2017-04-23 16:36:32 7686

转载 React Native for Android 异常处理概览

本文的RN代码基于0.43版本   https://blog.desmondyao.com/rn-crash/准备接入React Native(RN)时,看看前辈们分享的经验,都说刚接入时崩溃率是一个问题。最近在做RN的Native部分优化,今天就来聊聊在RN中的异常都是什么,该怎么处理。前言首先,研究RN框架异常的动机在于,我们需要建立起一套针对性的容错机制,毕竟它还是一

2017-04-23 16:35:25 3227

转载 用 webpack 实现持久化缓存

什么是持久化缓存?原文链接https://sebastianblade.com/using-webpack-to-achieve-long-term-cache/缓存(cache)一直是前端性能优化的重头戏,利用好静态资源的缓存机制,可以使我们的 web 应用更加快速和稳定。仅仅简单的资源缓存是不够的,我们还要为不断更新的资源做持久化缓存(Long term cache)。以前我们能利

2017-04-23 13:46:31 4186 1

转载 如何在 webpack 中引入未模块化的库,如 Zepto

前言原文链接: https://sebastianblade.com/how-to-import-unmodular-library-like-zepto/最近我在研究多页面 webpack 模块打包的完整解决方案时,发现用 import 导入 Zepto 时,会报 Uncaught TypeError: Cannot read property 'createElemen

2017-04-23 13:43:05 13145

原创 React-Native Fetch使用Promise封装(一)

项目中封装Fetch的方法/** *2017/04/23 dongtao * 基于 fetch 封装的 GET请求 * @param url * @param params {} * @param headers * @returns {Promise} */ var HTTPUtil = {}; HTTPUtil.get = function(url, p

2017-04-23 13:38:21 3312

转载 vue-cli入门(三)——人员管理实例

前言在开始开发实例前,应首先了解一下vue-cli的项目结构。接着我们一起来实现一个小demo——人员管理,功能简单,通过这个实例让大家熟悉使用vue-cli开发项目的一些操作,加深对vue-cli项目结构的印象。http://www.jianshu.com/p/5d9b341d650f实例功能简述人员管理项目,有两个页面,首页和管理页,管理页主要实现一个简单的增删改功能,

2017-04-23 08:11:14 15181 1

转载 vue-router路径计算问题

昨天刚刚发表了一个前端跨域新方案尝试,今天在开发中就遇到的了问题。http://www.jianshu.com/p/56e1500e4060起因前端使用的是vue-router组件的history模式,但是由于我们的整个页面都是从static(静态资源站)load过来的,所以其他页面自然也需要跨域去拿,然而就在跨域的时候 vue-router 出了问题。分析问题我们

2017-04-23 08:09:59 4023

转载 vue专题

学习地址 https://www.awesomes.cn/subject/vue

2017-04-23 08:09:20 787

转载 基于Vue 2.0高仿 <今日头条> 单页应用。

vue-toutiao这是用vue.js 2.0高仿今日头条的移动端项目,结合了原生app的部分功能以及网页版。http://www.jianshu.com/p/8abaf1414ffc前言本人是今日头条的重度用户,在学习vue.js过程中,在GitHub上看到了很多高仿webapp的好项目。由此在有了一定的技术积累后,开始构思使用Vue写今日头条,一是自己对于头条的喜

2017-04-23 08:05:21 2004

转载 JS浅克隆与深克隆

因为近日的项目需要用到对数组做深克隆,所以做一个简要介绍与总结。一开始听说这个概念的时候吓一跳,觉得高深莫测,有点怕怕啊。完了了解一下,哦,原来就这玩意啊~~~那么什么是深克隆,什么是浅克隆呢?首先,克隆只针对对象、数组、函数等复杂数据。浅克隆就是将栈内存中的引用复制一份,赋给一个新的变量,本质上两个指向堆内存中的同一地址,内容也相同,其中一个变化另一个内容也会变化

2017-04-23 08:03:30 8519 3

转载 React Native Linking跨app的通信方法

IOS/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text, Linking, Touch

2017-04-22 19:31:52 5268

原创 React Native之Modal组件实现遮罩层效果

React-Native中Modal的使用/** * React Native App * dongtao 2017/04/22 * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text, Modal, PixelRatio, View

2017-04-22 18:21:27 20348

转载 React-Native iOS启动闪白屏问题完美解决方案:react-native-launch-image

由于RN首次启动的时候,需要加载整个bundle,再render出首页面,这个过程通常需要耗费总计几百毫秒到一两秒不等。在默认工程中,这个过程中给用户展示出的都是白色的背景,因此用户会感觉到屏幕有一小段时间的白屏,从而影响用户体验。为了解决这个问题,我们寻找了一些方法,最后推出了这个开源组件。安装如果你之前没有用过rnpm,请先安装rnpm安装如果你之前没有用过rnpm,请

2017-04-22 11:19:04 3091 1

转载 React Native原生UI封装以及事件处理

对于目前的移动端原生开发来说,想要完成一个app的开发工作是比较容易的,因为原生代码在网上所提供出来的各种开源的第三方组件已经成千上万了,足以支撑起你的业务需求。但是如果我们想要在React Native上使用第三方组件怎么办?众所周知,React Native自身框架也提供了一部分基础组件,已经可以基本满足我们的开发需求,但是,当我们需要使用第三方接口的时候该如何?目前市面上基本所有的第三方

2017-04-22 11:02:51 1696

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除