Question

我正在创建反应原生应用。在应用程序类别页面上，我以json形式从实时URL获取数据并将其发布到产品页面中。获取数据代码： -

handlePressProduct(id) {
    var url='http://www.furnitureinfashion.net/menu_category_listing.php?cat_id=';  
    fetch(url+id, {
    method: 'GET'
    }).then((response) => { return response.json() } )
    .then((responseJson) => {
    console.log(responseJson);
    Actions.product({data:responseJson}) 
    })    
}

在产品页面上我得到的数据如下： -

        {this.props.data.map((dataImage,Index1)=>
        <View key={Index1}>     
        {dataImage['ProductId'] != undefined && (
                <View style={productStyle.homeimg1}>
                <TouchableOpacity onPress={this.handlePressProduct.bind(this,dataImage['ProductId'])}>
                        <Image source={{uri: uri+dataImage['Image']}} style={{width: 130, height: 130}} />
                        <Text style={productStyle.title}> {dataImage['ProductName']}</Text>                         
                        <Text style={productStyle.shopbutton}>View Details</Text>
                    </TouchableOpacity>     
                    {dataImage['Options'] != '' &&(
                    <Text style={productStyle.cartbutton} >Select Option</Text> 
                    )}  
                    {dataImage['Options'] == '' &&(
                    <Text style={productStyle.cartbutton} >Add to cart</Text>
                    )}
                    <Text> RRP{dataImage['RRPPrice']}</Text>
                    <Text> Our Price{dataImage['OurPrice']}</Text>
                    <Text style={productStyle.buymorebutton} >Buy & Save More Today</Text>
                    <Text style={productStyle.shiptext} >Free Shipping</Text>
                </View>
                )}
        </View>
        )}

阵列产品数据中的

太大，我想在产品页面上添加分页。但我不知道该怎么做？

如何在产品列表React Native上使用分页

0 个答案: