react-native
小毅哥哥
让代码飞一会
展开
-
Text 组件
Text 组件代码实现在 index.ios.js中//Text 组件//Timport React, { Component } from 'react';import { AppRegistry, StyleSheet, Text, View} from 'react-native';/* 常用特性: onPress 手指的触摸事件 number原创 2017-06-15 19:15:58 · 485 阅读 · 0 评论 -
ReactNative 的开发工具WebStorm破解版使用+React Native 终端常用命令
WebStorm破解版使用: 打算用闲暇功夫想学习下React-Native技术 但苦于找不到一款好的代码编辑器(之前看一些视频教程推荐了用 Atom,用了时候发现太坑了),在朋友的介绍下,发现最适合的就是网页代码编辑器WebStrom,所以就尝试安装和破解,下面我将自己的经验分享出来,为以后也需要用mac做前端和开发React-Native的朋友们提供福利!1. 下载软件最好的地址就是官网了原创 2017-06-19 18:36:39 · 1626 阅读 · 0 评论 -
RN 的 fetch 组件网络请求
创建一个.js 文件import React, {Component} from 'react';import { AppRegistry, StyleSheet, Text, View, TouchableOpacity} from 'react-native';/** 在 ReactNative 中,使用 fetch 实现网络请求. fetch原创 2017-06-23 18:49:53 · 2767 阅读 · 0 评论 -
React Native开发错误警告处理总结(持续更新)
注:本文是我在开发过程中遇到问题解决方法的总结,文中有不妥的地方希望指出共同学习,之后会持续更新,希望帮助到更多的学习者。Error SetError1 本地静态图片无法加载展示Error2 本地静态图片无法加载展示Error3 react-native构建项目 run-ios 时失败 Does Not ExistError 4 使用了第三方库失败Error 5 关于导航原创 2017-06-19 14:47:03 · 3407 阅读 · 0 评论 -
RN 的scrollable-tab-view控件(同一页面选择切换)
一. 基础选项卡1. 在 index.ios.js 文件中import React from 'react';import { AppRegistry, Text, Button, View,} from 'react-native';var ScrollableTabView = require('react-native-scrollable-原创 2017-06-23 16:18:44 · 3534 阅读 · 0 评论 -
react-native 的 TabBarIOS 组件(底部选择器)
方法一 创建一个 tabbarjs 文件直接在 indexiosjs 中导入 tabbarjs 即可方法二 直接在 indexiosjs 中编写方法一 : 这是在 react-native 中文官网上的例子,亲测功能效果很不错,推荐使用 1. 创建一个 tabbar.js 文件'use strict';原创 2017-06-22 18:05:33 · 1643 阅读 · 0 评论 -
RN的购物车实现( 数量,单价,总价,总数 )
1. 导入 JSON 数据: (data.json)[ { "id": "1", "image": "a", "money": "39", "name": "\u5fb7\u56fdOETTINGER\u5965\u4e01\u683c\u5927\u9ea6\u5564\u9152500ml*4\u7f50\/\u7ec4" }, { "id":原创 2017-07-01 11:07:53 · 2626 阅读 · 0 评论 -
RN 的持久化存储(AsyncStorage)的使用
AsyncStorage 是RN 库自带的系统控件,不需要 npm 直接 import 使用即可 下面有两种方法:方法一 .import React, {Component} from 'react'import { AppRegistry, StyleSheet, View, TextInput, AsyncStorage, Text}原创 2017-07-01 10:45:42 · 5059 阅读 · 0 评论 -
RN 中的秒杀倒计时功能实现 (react_native_countdowntimer)
倒计时控件,只需要添加一个结束时间。适用于商品秒杀页面等等。 这里有三种样式的倒计时模式,废话不多上,直接上码1. 导入依赖:npm install react_native_countdowntimer --save2.定义一个使用类: ( CountDownPage.js )import React, { Component, PropTypes } from 'react'import {原创 2017-07-01 10:08:39 · 4296 阅读 · 3 评论 -
RN开源播放器Video组件(react-native-video)
开源项目地址: https://github.com/brentvatne/react-native-login一. 项目介绍该组件进行封装成React Native平台播放器Video组件,大家可以使用该组件进行播放视频啦~不过支持React Native的版本最低0.19版本。二.1.1. 运行命令进行安装npm install react-native-video --save1.2.i翻译 2017-07-01 09:51:59 · 8779 阅读 · 1 评论 -
ListView组件
ListView一 基本功能创建一个 myListViewjs 文件在 indexiosjs 文件中引用 myListViewjs 二 电影列表本地加载一个 JSON 文件创建 movieListViewjs 文件修改 indexiosjs 文件在 xcode 中设置网络ListView一 .基本功能 1. 创建一个 m原创 2017-06-20 12:49:55 · 344 阅读 · 0 评论 -
React Native 的 Navigator 组件(导航功能)
在0.44版本之前和之后的方法是不同的,有时候回出现以下问题: ‘Navigator is deprecated and has been removed from this package. It can now be installed ’ + ‘and imported from react-native-deprecated-custom-原创 2017-06-20 19:31:37 · 885 阅读 · 0 评论 -
ScrollView组件
ScrollView一 基本功能在 indeiosjs 中新建另一个js 文件myScrollViewjs二电影模块添加一个本地 JSON 数据文件 datajson 创建一个movieListjs文件在 indexiosjs文件中修改配置ScrollView一 .基本功能1.在 inde.ios.js 中//ScrollView组件import React, {Component}原创 2017-06-19 18:43:53 · 1218 阅读 · 0 评论 -
React Native的Mac安装调试(搭建开发环境&运行问题)
以下内容的目标平台是:iOS,开发平台是:MacOS 系统: 可以前去 React Native 中文官网看看文档使用说明 安装HomebrewHomebrew, Mac系统的包管理器,用于安装NodeJS和一些其他必需的工具软件/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/insta原创 2017-06-14 15:47:52 · 2464 阅读 · 0 评论 -
RN中的push 后底部 Tabbar 隐藏or修改&& 页面传值
一. Tabbar 隐藏 以下方法会导致使用了 Navigator 导航是自动隐藏了 tabbar .(push 之后再次需要时就要用下面方法添加一个新的 tabbar 了)1.打开 Xcode 工程项目找到RCTNavigator.m,在-(void)navigationController:(UINavigationController)navigationController w原创 2017-06-28 16:09:40 · 1460 阅读 · 0 评论 -
Iamge组件
代码//Image组件import React, {Component} from 'react';import { AppRegistry, StyleSheet, Text, View, Image} from 'react-native';/* 用于显示图片的组件,包括网络图片,静态资源等等 常用性能: resizeM原创 2017-06-18 19:01:32 · 450 阅读 · 0 评论 -
TextInput组件(绑定事件)
搜索框 在输入框中输入,点击搜索获取搜索款的 value代码实现//TextInput组件(绑定事件)import React, {Component} from 'react';import { AppRegistry, StyleSheet, Text, View, TextInput, TouchableOpacity} from 'r原创 2017-06-17 17:43:19 · 2896 阅读 · 0 评论 -
TouchableOpacity组件(绑定事件)
代码实现(index.ios.js)//TouchableOpacity组件(绑定事件)import React, {Component} from 'react';import { AppRegistry, StyleSheet, Text, View, TouchableOpacity} from 'react-native';/* React原创 2017-06-17 15:04:47 · 2665 阅读 · 0 评论 -
View组件
View 组件View 组件import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text, View} from 'react-native';var HelloReactNative = React.createClass({ render:function () {原创 2017-06-15 17:36:10 · 406 阅读 · 0 评论