ios - this.setState is not a function and undefined even its context set properly

im trying to show progressLoader to the user in login screen until web service response comes. it works when i press the login button. problem is im getting this.setState is undefined when i try to hide it from this line this.setState({showLoader: false}) in the response. even i set context properly to the like in this question this.setState is not a function

export default class Loginform extends Component{
    constructor(props){
        super(props);
         this.state = {
            username: '',
            password: '',
            showLoader: false,

        }

        this._login = this._login.bind(this);
    }

/** Login Web Service **/
    _login(){
        this.setState({showLoader: true})
        const { username, password } = this.state;
        console.log(username);

            let formdata = new FormData();
            formdata.append("username", username)
            formdata.append("password", password)
            formdata.append("device_type", 'I')
            fetch('http://www.URL.com/ws/login', {method: 'POST', body:formdata, headers: {'Accept':'application/json', 'Content-Type':'application/json',}})
            .then(function(response) {
                if(response.status == 200) return response.json();
                else throw new Error('Something went wrong on api server!');
                this.setState({showLoader: false})
            })

            .then(function(response) {
                console.debug(response);
                this.setState({showLoader: false}) /** Im Getting Error here **/
            })
            .catch(function(error) {
                console.error(error);
                this.setState({showLoader: false})
            });     
    }



    render(){
        return(
            
                  
                     {this.state.showLoader && }
                     {/**/}
                 
            
                
                onSubmitEditing={() => this.passwordInput.focus()}
                onChangeText={(username) => this.setState({username})}/>

                                ref={(input) => this.passwordInput = input}
                onChangeText={(password) => this.setState({password})}/>

                
                    LOGIN
                    


                    
            
        );
    }
}

Answer

You just need to bind the context of the fetch .then() callback and .catch() callback so that setState is available for you

fetch('http://www.URL.com/ws/login', {method: 'POST', body:formdata, headers: {'Accept':'application/json', 'Content-Type':'application/json',}})
            .then(function(response) {
                if(response.status == 200) return response.json();
                else throw new Error('Something went wrong on api server!');
                this.setState({showLoader: false})
            }.bind(this))
            .then(function(response) {
                console.debug(response);
                this.setState({showLoader: false}) 
            }.bind(this))

            .catch(function(error) {
                console.error(error);
                this.setState({showLoader: false})
            }.bind(this));

or

    fetch('http://www.URL.com/ws/login', {method: 'POST', body:formdata, headers: {'Accept':'application/json', 'Content-Type':'application/json',}})
            .then((response) => {

                if(response.status == 200) return response.json();
                else throw new Error('Something went wrong on api server!');
                this.setState({showLoader: false})
            })
            .then((response) =>{
                console.debug(response);
                this.setState({showLoader: false}) 
            })
            .catch((error)=> {
                console.error(error);

                this.setState({showLoader: false})
            });