Code Monkey home page Code Monkey logo

react-native-backbone's Issues

delete not working!!

delete not working, I tried destroy and it worked but without any callback function, how to get the response?

TypeError: Network request failed(…)

I've been trying to solve this problem but i got no luck so far. I'm doing almost the same as the examples of documentation. I want my app to get the info of the url im providing. In the console i get the error as the title says "TypeError: Network request failed(…) ".Here is my code for it:

`'use strict';

import React, { Component } from 'react';
import {
StyleSheet,
View,
Text,
DrawerLayoutAndroid,
StatusBar,
Image,
ToastAndroid,
ScrollView
} from 'react-native';

import {
MKProgress,
MKSpinner,
} from 'react-native-material-kit';

var MyToolbar = require('./MyToolbar');
import Button from 'react-native-button';
import Icon from 'react-native-vector-icons/MaterialIcons';
import RNBackbone from 'react-native-backbone';
import fetchStorage from 'react-native-backbone/src/storages/fetch';

const styles2 = StyleSheet.create({
progress: {
width: 370,
height: 4,

},
spinner: {
width: 22,
height: 22,
},
});

class BoatsContent extends Component {
constructor() {
super();
this.state = {
isLoading: true
};

    fetchStorage.globalOptions.headers = {
        "Authorization": "Bearer AUTH_TOKEN"
    };

    var Businesses = RNBackbone.Collection.extend({
        url: 'http://api.example.com',
    });

    var businesses = new Businesses();

    businesses.fetch({
        success: () => {
            console.log(businesses);
            this.setState({isLoading: false});
        },
        error: (model, error) => {
            console.log(error);
            console.log(this.state.isLoading);
            console.log(businesses);
        }
    });
}

render() {
if (this.state.isLoading) {
return (
<DrawerLayoutAndroid
drawerWidth={300}
drawerPosition={DrawerLayoutAndroid.positions.Left}
renderNavigationView={() => this.props.navigationView}
ref={'DRAWER'}>

        <View style={[styles.row,{ flex: 0.11 } ]}>
            <View style={[styles.container,{ flex: 1 }]}>
                <MyToolbar style={styles.toolbar} title={this.props.title} sidebarRef={()=>this._setDrawer()} openIcon={()=>this.gotoNext()}/>
                <StatusBar backgroundColor='#01A0B4' />
            </View>
        </View>
        <ScrollView>
            <MKProgress.Indeterminate
              style={styles2.progress}
            />
            <Text>Fetching from API, please wait...</Text>
            <View style={[styles.container,{ flex: 1.2, marginTop: 410, marginLeft: 250}]}>             
                <Button
                    containerStyle={{padding:23, height:60, width: 60, overflow:'hidden', borderRadius:100, backgroundColor: '#01BCD4'}}
                    style={{fontSize: 30, color: 'white'}}>
                    <Image pointerEvents="none" source={require('./img/plus_white.png')} />
                </Button>
            </View>
        </ScrollView>
      </DrawerLayoutAndroid>      
    );      

} else {
    return (
      <DrawerLayoutAndroid
        drawerWidth={300}
        drawerPosition={DrawerLayoutAndroid.positions.Left}
        renderNavigationView={() => this.props.navigationView}
        ref={'DRAWER'}> 

        <View style={[styles.row,{ flex: 0.11 } ]}>
            <View style={[styles.container,{ flex: 1 }]}>
                <MyToolbar style={styles.toolbar} title={this.props.title} sidebarRef={()=>this._setDrawer()} openIcon={()=>this.gotoNext()}/>
                <StatusBar backgroundColor='#01A0B4' />
            </View>
        </View>
        <ScrollView>
            <Text>Successfully fetched {this.business.length} models from REST api</Text>
            <View style={[styles.container,{ flex: 1.2, marginBottom: 20, marginRight:20}]}>                
                <Button
                    containerStyle={{padding:23, height:60, width: 60, overflow:'hidden', borderRadius:100, backgroundColor: '#01BCD4'}}
                    style={{fontSize: 30, color: 'white'}}>
                    <Image pointerEvents="none" source={require('./img/plus_white.png')} />
                </Button>
            </View>
        </ScrollView>
      </DrawerLayoutAndroid>      
    );
}

}

_setDrawer() {
this.refs['DRAWER'].openDrawer();
}

}

const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
},
toolbar: {
height: 56,
backgroundColor: '#01BCD4',
width: 370,
alignItems: 'center'
},
fab: {
width: 60,
height: 60,
borderRadius: 100,
borderColor: '#01BCD4',
backgroundColor: '#01BCD4',
marginLeft: 285,
marginTop: 410,
},
});

module.exports = BoatsContent;`

Callback response is coming twice.

Hi,

When I make network call & it gives me error response ie. response code not between 200 & 208,callback function is getting returned twice.

        if (!((response.status >= 200 && response.status <= 208) || (response.status === 226))) {

            var error = {};

            console.log("response error 123");

          error.status = response.status;

            error.statusText = response.statusText;

            error.body = response._bodyText;
     //Once from here
            return callback(error, null);

        }


        return response.json();
    })
    .then((json) => {
     // Once from here.
            callback(null, json);


    })
    .catch(function (error) {
        console.log("response then erroe");
        callback(error, null);
    });

It might be because of Promise getting called.
kindly take a look

I am sorry for multiple edits.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.