React-Native进行时(四)--ListView navigator.push

前端之家收集整理的这篇文章主要介绍了React-Native进行时(四)--ListView navigator.push前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

React-Native进行时(四)--ListView navigator.push

1、使用Nav时必须添加

TouchableHighlight、

NavigatorIOS;

var {
  AppRegistry,StyleSheet,Text,View,NavigatorIOS,TouchableHighlight,} = React;

使用时nav必须有个rootView,这点iOS基本一致 ,ios使用如下:

- (instancetype)initWithRootViewController:(UIViewController *)rootViewController
react-native使用如下:

<NavigatorIOS style={Style.container}
                    tintColor={'#333344'}
                    initialRoute={{
                      title: '忽悠',component: require('./App/Views/Home/Home')
                    }}
                    itemWrapperStyle={Style.navigator} />

2、push使用这点和iOS不太一样,iOS使用如下方法就可以实现:

- (void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated
react-native必须使用TouchableHighlight配合,代码如下:

<TouchableHighlight onPress={() => this.showDetail(rsustlBody)} >
        <View style={styles.container}>
          <Image
            source={{uri: rsustlBody.OtherInfo.ProductImg}}
            style={styles.thumbnail}
         />
          <View style={styles.rightContainer}>
            <Text style={styles.title}>{rsustlBody.Name}</Text>
            <Text style={styles.year}>{rsustlBody.BrokerCommissionRate}</Text>
          </View>
        </View>
      </TouchableHighlight>
使用TouchableHighlight时,里面必须要有View

猜你在找的React相关文章