React Native工作小技巧及填坑记录
以下是本人在React Native开发工作中使用的一些小技巧,记录一下。
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 = {
'
|