React Native工作小技巧及填坑记录
来源:互联网 发布:人事管理系统源码 编辑:程序博客网 时间:2024/04/29 16:29
以下是本人在React Native开发工作中使用的一些小技巧,记录一下。
http://www.cnblogs.com/shaoting/p/6491978.html
1.从网络上拉取下来的React Native缺少React和React Native库.
终端
1. cd 项目根目录
2. npm install
3. 完成之后,在根目录中会出现node_modules文件夹(和package.json同级目录).OK.接下来使用Xcode再次打开就好了.
2.如何导入第三方库.
1.cd 项目根目录
2.npm i 库名 --save
如: npm i react-native-tab-navigator --save 导入了react-native-tab-navigator这个库
3.获取屏幕的宽和高
使用Dimensions
1
2
var
Dimensions = require(
'Dimensions'
);
var
{width,height} = Dimensions.get(
'window'
);
使用:
1
2
3
leftViewStyle:{
width:width/4,
},
4.根据不同的平台设置不同的效果
使用Platform
先引入Platform:
1
2
3
4
5
6
7
8
9
10
import
{
AppRegistry,
StyleSheet,
Text,
View,
ListView,
Image,
TouchableOpacity,
Platform
} from
'react-native'
;
使用:
1
2
3
4
iconStyle:{
width: Platform.OS ===
'ios'
? 30 : 25,
height:Platform.OS ===
'ios'
? 30 : 25
},
5.颜色值使用RGB三色值.
1
backgroundColor:
'rgba(234,234,234,1.0)'
,
6.ref的使用,可以获取上下文的组件.
1
<TextInput ref=
"tel"
style={styles.telInputStyle} placeholder = {
'
阅读全文
0 0
- React Native工作小技巧及填坑记录
- React Native工作小技巧及填坑记录
- React Native工作小技巧及填坑记录
- React Native工作小技巧及填坑记录
- iOS工作小技巧及填坑记录
- React Native安卓应用调试填坑记录
- react-native Navigator 填坑
- React Native 填坑指南
- react native实战填坑
- react native 填坑之旅
- react-native 填坑之旅
- React Native JavaScripts的实用小技巧
- React Native 之小技巧总结
- React Native踩坑记录
- React Native 入坑记录
- React Native填坑之旅--Button篇
- React Native填坑之旅--动画篇
- React Native填坑之旅--HTTP请求篇
- 原生js的ajax请求兼容写法
- Springboot集成mybatis注解方式
- java后台 通过HTTP接口获取json数据
- HDU 3811 状态压缩DP
- 理解D3D—(2)最多混合几层texture
- React Native工作小技巧及填坑记录
- nyoj 214 单调递增子序列(二) lower_bound
- 多进程编程
- Monkey and Banana (最长子序列)
- C++ Primer 读书笔记——表达式
- 从服务器上获取api接口数据 生成实体类并显示在listview或TextView中
- 相对路径 './' 和 '../' 的区别?
- 抽象工厂模式
- angularjs数组判断是否含有某个元素