react-native
big_sea_m
这个作者很懒,什么都没留下…
展开
-
react-native调用安卓代码-高级应用
react-native调用安卓代码第一步写一个类来封装要调用的方法package com.rndemo;import android.content.Intent;import android.widget.Toast;import com.facebook.react.bridge.ReactApplicationContext;import com.facebook.react.bridg原创 2017-11-03 15:40:16 · 327 阅读 · 0 评论 -
在js中打印对象数据
在js中打印对象数据如何在js中打印对象呢,起初以为对象.toString结果打印出来还是object,后来问了大神,说可以使用console.dir(obj);结果还是不行,最后我找到了转为json,可以打印任何对象JSON.stringify(this.state),有什么数据一目了然。原创 2017-12-27 09:46:48 · 34032 阅读 · 2 评论 -
react-native的state
在react-native中state扮演着很重要的角色,我们可以在state中存放数据,布局也可以根据state的状态变化而重新渲染布局。在构造方法中初始化stateconstructor(props) { super(props); this.state = { data: '' }; }设置data的数据this.setState({data: '原创 2017-12-18 17:06:08 · 351 阅读 · 0 评论 -
react-native 使用Navigation跳转界面
react-native 使用Navigation跳转界面在学习了多种开发语言框架什么的都有了自学的技巧,最重要的就有界面跳转了。这篇尽量写详细一点,在我的工作中是如何使用的。 1.还是一如既往的导入react-navigation,当然如果有了就不用导了 2.根据官方文档说在根界面,在根界面添加所有的界面如const Router = StackNavigator({ MyApp: {原创 2017-11-06 14:54:31 · 440 阅读 · 0 评论 -
react-native 生命周期
react-native 生命周期1.创建阶段1.getDefaultProps() 处理外部传进来的属性2.实例化阶段1.render() 启动之后,渲染布局 2.getInitialState() 初始化组件的state值 3.componentWillMount() 在render之前调用此方法,如处理state的操作 4.componentDidMount() 在render之后原创 2017-10-26 17:24:51 · 196 阅读 · 0 评论 -
React-native Navigation之TabNavigator
React-native Navigation之TabNavigator在0.44之后开始推荐使用React Navigation下的主键开发 这篇博客主要讲解React-Navigation之TabNavigator 开始工作第一步:导入新包,我使用的yarn add react-navigation,也有看到其他有使用npm添加的,但在我这里我没有成功,还是装了一个yarn 第二步:引入模原创 2017-11-06 14:37:44 · 398 阅读 · 0 评论 -
react-native仿Android底部table(过时的了)
react-native仿Android底部table使用步骤1.添加库 开始我使用的npm install react-native-tab-navigator –save 文件是加载进来了,但是一直报错yarn add react-native-tab-navigator2.使用,使用方式很简单,按以下模板就行import React from 'react';// 引入布局Viewimpor原创 2017-10-25 15:16:28 · 416 阅读 · 0 评论 -
react-native的原生传参到rn
react-native的原生传参到rn1.在安卓端的代码package com.rndemo;import android.os.Bundle;import com.facebook.react.ReactActivity;import com.facebook.react.ReactActivityDelegate;public class MainActivity extends React原创 2017-11-03 14:52:42 · 1605 阅读 · 0 评论 -
react-native的WebView使用
react-native的WebView使用属性介绍domStorageEnabled bool 是否储存dom元素 injectJavaScript?: function 在网页加载完成之后,还可以主动调用此方法(以ref形式调用)继续给WebView注入JS代码。注入后会立即执行。 injectedJavaScript string 设置在网页加载之前注入的一段JS代码。 m原创 2017-10-25 18:04:40 · 3050 阅读 · 0 评论 -
react-native 使用Flexbox布局
react-native 使用Flexbox布局在View中使用flexDirection属性 row:水平布局,column:垂直布局flexDirection: 'row'justifyContent属性 flex-start:靠前,center:居中,flex-end:靠后,space-around:平分后居中,space-between:平分后靠外侧justifyContent: 'sp原创 2017-10-25 17:51:02 · 147 阅读 · 0 评论 -
react-native的ListView控件的使用
react-native的ListView控件的使用1.数据准备 // 在构造方法中准备 constructor(props) { super(props); this.state = { // 创建一个DataSource dataSource: new ListView.DataSource({原创 2017-10-25 17:07:51 · 588 阅读 · 0 评论 -
react-native的使用教程
react-native的使用教程TouchableHighlight 点击时布局背景变色属性 activeOpacity={0.5} 当按下时空件文字的显示的不透明度(通常在0到1之间)。1全显示 onPress={this._onPressButton} 按下的事件,要加事件才能起效<TouchableHighlight activeOpacity={0.5} underlayColor=原创 2017-10-25 11:22:13 · 401 阅读 · 0 评论 -
react-native的props和state的使用
react-native的props使用props // 使用props传值 <View style={{marginTop: 20}}> <CommonCell title="扫一扫"/> </View> // 在组件中设置默认props值 static defaultProps = { title: '', // 标题原创 2017-10-31 13:34:48 · 221 阅读 · 0 评论 -
在react-native中使用react-redux
最近被redux搞得晕头转向的,总算弄了个可以实现的效果了项目结构Action代码/** * Created by Administrator on 2017/12/26. */export const ADD_TEXT = 'ADD_TEXT';/** * 数据处理,可以是网络数据本地数据 * @param text * @returns {{type: string, text: *}原创 2017-12-27 13:56:52 · 587 阅读 · 0 评论