React Native
关注
分享
扫一扫
文章平均质量分 72
海阔天空6688
博客基本都是在开发中遇到的问题是怎么解决的和平时的一些记录，希望对同行有帮助，有任何问题，可以通过博客联系，共同学习，共同进步。
展开
-
React Native插件系列
react-native-linear-gradient 颜色渐变处理react-native-login 视频界面登录react-native-keyboard-aware-scroll-view 键盘显示处理react-native-popup-dialog 弹窗react-native-dropdownalert 一种非常漂亮的alert弹窗方式，从状态栏往下弹窗；react-n...转载 2019-04-09 10:09:15 · 258 阅读 · 0 评论 -
Build input file not be found
Build input file not befound:/Users/XXX/Library/Developer/Xcode/DerivedData/XXXX前往 '/Users/XXX/Library/Developer/Xcode/DerivedData，把DerivedData目录下的所有东西删掉，重启电脑，clean——rebuild...原创 2019-01-29 19:50:31 · 2343 阅读 · 0 评论 -
'RCTAssert.h' file not found
在项目下的Libraries文件夹下，选中RCTAnimation.scodeproj，在Build Settings下修改Search Paths 中 header search paths 的路径为 $(SRCROOT)/…/…/react-native/React原创 2019-01-29 19:49:52 · 1174 阅读 · 0 评论 -
XCode编译报错：Build input file cannot be found.md
WebSocket / libfishhook.a 链接文件未找到error：Build input file cannot be found：‘/Users/…/Libraries/WebSocket/libfishhook.a’解决方法：找到Libraries/RCTWebScoket.xcodeproj——RCTWebSocket——选择Build Phases——选择Link Bin...原创 2019-01-29 19:49:05 · 15848 阅读 · 0 评论 -
Xcode运行出现dyld_shared_cache_extract_libs_failed
1完全退出Xcode2、前往文件夹：~/Library/Developer/Xcode/iOS DeviceSupport/ ，删除手机对应的系统版本。进入快捷键：Command+Shift+G原创 2019-01-29 19:48:23 · 852 阅读 · 0 评论 -
xcode打开ios提示pod的相关消息
是因为缺少Pod相关东西，如果要执pod的命令，需要安装CocoaPods：OS X 10.11以前，在终端输入以下命令：sudo gem install cocoapodsOS X 10.11以后，在终端输入以下命令：sudo gem install -n /usr/local/bin cocoapods安装完成后就可以执行 pod install命令进行安装，安装完后再运行。安...原创 2019-01-29 19:47:46 · 136 阅读 · 0 评论 -
React 封装原生viewgroup调用（Android）
ViewGrouppublic class RCTViewGroup extends FrameLayout { private Context mContext; private Paint mPaint; public RCTViewGroup(Context context) { super(context); this.mCont...原创 2019-01-29 19:45:01 · 606 阅读 · 0 评论 -
禁止字体随系统的修改而变化
Android//在MainActivity中增加下面的代码@Overridepublic Resources getResources() { Resources res = super.getResources(); Configuration config=new Configuration(); config.setToDefaults(); ...原创 2019-01-29 19:44:07 · 1179 阅读 · 0 评论 -
webview（Android） 加载h5实体按键（虚拟按键）返回处理
添加onNavigationStateChange方法并判断<WebView onNavigationStateChange={this.onNavigationStateChange}/>/** * 是否可以返回 * @param navState */onNavigationStateChange=(navState)=>{ this.setState...原创 2019-01-29 19:43:17 · 1667 阅读 · 0 评论 -
CodePush
安装输入下面命令安装code-pushnpm install -g code-push-cli1、使用微软服务器打开命令提示符进行注册登陆code-push register在浏览器跳转的注册界面让选择授权登录,获取access key，在终端输入获取key，进行登陆code-push login2、使用自己部署的服务器打开命令提示符进行注册登陆code...原创 2019-01-29 19:41:58 · 1145 阅读 · 2 评论 -
webview 加载html报错
webview 加载html时IOS报错error loading page domain:webkiterrordomain error code:101解决方法：&amp;lt;WebView //添加下面内容 nativeConfig={{ props: { backgroundColor: 'black', fle...原创 2019-01-29 19:51:34 · 468 阅读 · 0 评论 -
TextInput在ios中不能输入中文
不能value和onChangeText同时使用,在IOS中使用onEndEditinglet publishtitle;if(Platform.OS==='android'){ publishtitle=(&lt;TextInput style={[styles.textInput, styles.textAlign]} placeholder="请输...原创 2019-02-28 15:39:27 · 1691 阅读 · 0 评论 -
原生给React发消息
导入原生模块import { NativeModules } from 'react-native';export default NativeModules.NativeView;Android发消息public class EventEmitterUtil { /** * 向RN发送消息 * @param reactContext * @pa...原创 2019-04-02 16:24:52 · 402 阅读 · 0 评论 -
Xcode could not locate device support files. 12.2（对应的版本）
下载对应的版本的iOS真机调试包，然后解压到/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/DeviceSupport目录下，重新打开Xcode就可以了。打开目录：方式一：打开访问达-应用程序-在Xcode右击，访问包内容，找到对应的目录方式二：打开 Finder，按下 command ...原创 2019-04-10 19:55:44 · 1365 阅读 · 0 评论 -
弹窗中出现控件变窄
一般是由于宽高出现小数引起的，解决方法是把宽高中的小数去掉，我的解决方法是下面这种方式，可能有其它的解决方式没有测试。Math.round(width / 36 * 2 / 2+0.5)...原创 2019-03-27 14:03:14 · 126 阅读 · 0 评论 -
ListView列表出现返回空白的情况
通过设置属性解决：removeClippedSubviews={false}通过刷新解决：在返回的前一页添加一个返送消息的事件，在列表页监听消息清空原来列表，设置dataSource，调用获取数据的方法DeviceEventEmitter.emit("refresh", "e");this.subscription=DeviceEventEmitter.addListener("re...原创 2019-03-21 16:25:22 · 779 阅读 · 0 评论 -
判断几分钟、几天...时间工具类
export function diaplayTime(data) { let str = data; //将字符串转换成时间格式 let timePublish = new Date(str); let timeNow = new Date(); let minute = 1000 * 60; let hour = minute * 60; ...原创 2019-03-20 14:14:04 · 275 阅读 · 0 评论 -
ListView数据更新UI不刷新
用一个常量接收一下，两个变量相当于两个地址，地址不同就不是同一个数据了，就会刷新const dataTemp =JSON.parse(JSON.stringify(latestMessageList))this.setState({ dataSource: this.state.dataSource.cloneWithRows(dataTemp)});...原创 2019-03-20 14:11:04 · 1282 阅读 · 0 评论 -
ReactNative Linking 打电话 发短信 打开其他App等
打开地图：url="geo:37.2122 , 12.222" 传入一个坐标(纬度，经度)打电话：url="tel:10086" 传入一个电话号码打开网站:url="http://www.baidu.com" 传入一个网址，http:// 不能少发送短信:url="smsto:10086"发送邮件：url"mailto:10000@原创 2019-02-19 15:13:59 · 562 阅读 · 0 评论 -
Text IOS垂直居中和IOS圆角的问题
垂直居中textAlign: 'center',//只在Android上起作用lineHeight:20,//iOS上要设置此属性圆角IOS不支持Text设置borderRadius属性，必须用view包裹，设置view圆角原创 2019-02-19 15:10:31 · 348 阅读 · 0 评论 -
react-native-wechat的使用
GitHub地址react-native-wechat微信组件的使用转载 2019-02-28 15:43:10 · 1848 阅读 · 17 评论 -
WebView控件的属性、样式、方法
主要属性source：在 WebView中载入一段静态的html代码或是一个 url（还可以附带一些 header 选项）automaticallyAdjustContentInsets：设置是否自动调整内容。格式：boolcontentInset：设置内容所占的尺寸大小。格式：{top:number,left:number,bottom:number,right:number}in...原创 2018-09-22 20:21:16 · 4972 阅读 · 0 评论 -
ViewPagerAndroid控件的属性、样式、方法
initialPage number初始索引页keyboardDismissModenone：（默认值），拖拽不会让键盘消失。on-drag： 当拖拽开始的时候会让键盘消失。onPageScroll function当在页面间滑动切换时执行。回调参数event.nativeEvent对象会包含如下数据：position：从左数起第一个当前可见的页面的下标。offset： 一...原创 2018-09-22 20:05:24 · 2004 阅读 · 0 评论 -
ReactNative DrawerLayoutAndroid控件的属性、样式、方法
drawerPosition抽屉的位置,指定在那边打开DrawerConsts.DrawerPosition.LeftDrawerConsts.DrawerPosition.RightdrawerWidth抽屉宽度：侧面导航视图可以从屏幕边缘拖拽到屏幕的宽度距离keyboardDismissMode在导航视图拖拽的过程中是否要隐藏键盘none：(默认值),不会隐藏键盘on-...原创 2018-09-21 17:10:01 · 807 阅读 · 0 评论 -
ReactNative ListView控件属性和样式
基本使用方式//构造函数中绑定数据constructor(props) { super(props); let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}) // 初始状态 this.state = { dataSource: ds.clo...原创 2018-09-18 09:51:29 · 646 阅读 · 0 评论 -
ReactNative ScrollView控件属性和样式
属性contentContainerStyle StyleSheetPropType(ViewStylePropTypes)这些样式会应用到一个内层的内容容器上，所有的子视图都会包裹在内容容器内horizontal当此属性为true的时候，所有的的子视图会在水平方向上排成一行，而不是默认的在垂直方向上排成一列。默认值为false。keyboardDismissMode用户拖拽滚动视图的...原创 2018-09-18 09:50:59 · 3128 阅读 · 0 评论 -
ReactNative Picker控件属性和样式
属性该控件可以使用View控件的全部属性onValueChange function某一项被选中时执行此回调。调用时带有如下参数：itemValue: 被选中项的value属性itemPosition: 被选中项在picker中的索引位置selectedValue any可以是一个字符串或者一个数字，item所选中的值style pickerStyleType传入style样...原创 2018-09-18 09:50:28 · 4540 阅读 · 0 评论 -
ReactNative Image控件属性和样式
用法加载本地图片<Image source={require('./img/baidu.png')}/>加载App内资源图片<Image source={{uri: 'ic_launcher'}} />加载网络图片<Image source={{uri:'http://172.17.137.68/heqiang/2.jpg'}} style={{wid...原创 2018-09-18 09:49:59 · 3183 阅读 · 1 评论 -
ReactNative Touchable控件属性和样式
TouchableHighlight(高亮触摸)注：TouchableHighlight只能进行一层嵌套，不能多层嵌套，如果需要多层嵌套就要用View包装activeOpacity：设置组件在进行触摸时候，显示的不透明度（取值：0 ~ 1）onHideUnderlay：当底层被隐藏的时候调用onShowUnderlay：当底层显示的时候调用style：可以设置控件的风格演示，该风格...原创 2018-09-18 09:49:21 · 390 阅读 · 0 评论 -
ReactNative TextInput控件的属性和样式
属性autoCapitalize：首字母自动大写。可选值有：nonesentenceswordscharacters。placeholder：占位符，在输入前显示的文本内容。value：文本输入框的默认值。placeholderTextColor：占位符文本的颜色。password：如果为 true，表示密码输入框。文本显示为“*”multiline：如果为 t...原创 2018-09-18 09:48:45 · 9756 阅读 · 0 评论 -
ReactNative Text控件属性和样式
属性numberOfLines文本行数限制，添加后超过限制行数文本会在末尾默认以…的形式省略。ellipsizeMode设置文本缩略格式，配合numberOfLines使用，values：tail：在末尾…省略（默认值）clip：在末尾切割，直接切割字符无省略符head：在前面…省略middle：在中间…省略onPress点击事件style样式样式color字体颜...原创 2018-09-18 09:48:04 · 3488 阅读 · 1 评论 -
ReactNative View控件属性和样式
属性：numberOfLines文本行数限制，添加后超过限制行数文本会在末尾默认以…的形式省略。ellipsizeMode设置文本缩略格式，配合numberOfLines使用，values： * tail：在末尾…省略（默认值） * clip：在末尾切割，直接切割字符无省略符 * head：在前面…省略 * middle：在中间…省略onPress点击事...转载 2018-09-16 18:23:16 · 2244 阅读 · 1 评论 -
ReactNative Text控件属性和样式
属性numberOfLines文本行数限制，添加后超过限制行数文本会在末尾默认以…的形式省略。ellipsizeMode设置文本缩略格式，配合numberOfLines使用，values： * tail：在末尾…省略（默认值） * clip：在末尾切割，直接切割字符无省略符 * head：在前面…省略 * middle：在中间…省略onPress点击事件...转载 2018-09-16 18:07:05 · 718 阅读 · 0 评论 -
环境搭建和初始化及常用命令
Node的安装和配置安装配置查看Node的教程中Node.js 安装配置ReactNative的安装和初始化安装npm install -g react-native-cli初始化进入到项目的路径下，打开命令提示窗口react-native init 项目名称运行命令==注意==：要重新打开一个命令窗口，进入到项目的目录下，运行下...原创 2018-09-13 11:38:08 · 326 阅读 · 0 评论 -
Cannot find entry file index.android.js in any of the roots
一在 ../../node_modules/react-native/react.gradles 文件中 添加project.ext.react = [ entryFile: "index.js"]重新运行到手机上就可以了二把index.js复制两份，分别改为index.android.js和index.ios.js...原创 2018-09-13 11:40:05 · 675 阅读 · 0 评论 -
ReactNative Progress(ProgressBarAndroid、ProgressViewIOS)控件的属性和样式
ProgressBarAndroid属性方法支持View控件的属性方法从View控件中继承下来， 例如:大小,布局,边距color设置进度的颜色属性值indeterminate设置是否要显示一个默认的进度信息，该如果styleAttr的风格设置成Horizontal的时候该值必须设置成falseprogress number设置当前的加载进度值(该值在0-1之间)styleA...原创 2018-09-21 16:54:09 · 904 阅读 · 0 评论 -
React-Native的基本控件属性方法
https://www.cnblogs.com/Hakim/p/5865519.html转载 2018-09-19 10:03:12 · 306 阅读 · 0 评论 -
Flexbox布局
Flex DirectionflexDirection属性可以决定主轴的方向（即项目的排列方向），它有以下取值： * column(默认值)：主轴为垂直方向，起点在顶端。 * row：主轴为水平方向，起点在左端。 * column-reverse：主轴为垂直方向，起点在下端。 * row-reverse：主轴为水平方向，起点在右端。Justify Contentjustif...原创 2018-09-13 17:58:03 · 192 阅读 · 0 评论 -
React Native目录结构
名称 描述 android目录 Android项目目录，包含了使用AndroidStudio开发项目的环境配置文件； ios目录 iOS项目目录，包含了XCode的环境 node_modules目录 基于node文件依赖系统产生的相关依赖和第三方lib index.js ios或android的入口，已经使用index.js代替ind...原创 2018-09-13 17:55:49 · 1720 阅读 · 0 评论 -
React Native命名规范
React/JSX代码规范文件与组件命名扩展名:使用.js作为js文件的扩展名。如果同一个文件夹下有同名而不同作用的js文件，则通过中缀（小写）进一步区分，例如：HomeView.component.js,HomeView.style.js,HomeView.action.js等。文件名: 使用驼峰命名法且首字母大写，如HomeView.js。组件命名: 与文件名（除中缀外）完全...转载 2018-09-13 13:59:05 · 2218 阅读 · 0 评论