es6 with axios login user and get respons

Question

I am a newbie at using es6 js, using babel, axios and es6 trying to login user and get a response from a PHP file and all I need is return the response pass it to a callback function. When login is a console logged I get undefined but I want to get access to the data returned just for references.

account.js

 export class Account{
        constructor(){

        }
        methodGet(method,url,inputData,callback){
            axios({
                method:method,
                url:url,
                data: {
                    logindata: inputData
                }
            })
            .then(response=>{callback(response)});
        }

        login(formdata){
            this.methodGet('get','user/logs/login.php',formdata,function (params) {
                let dataParam = params.data;
                return dataParam;
            });
        }
    }

app.js

    import { Account } from "./classes/account.js";
    let account = new Account();

    let form  = document.getElementById('form');

    form.addEventListener('submit',event=>{
        event.preventDefault();
        let formdata = new FormData(this);
        console.log(account.login(formdata));
    },true);

Answer 1

I've been there man, it happens with almost all of us. I would suggest you to go understand the basics of promises. Believe me it's one of the most important concept for async operations in JS, it will help you a lot.

I've done few changes in your, please try this.

account.js

export class Account{
            constructor(){

            }
            methodGet(method,url,inputData){
                return axios({
                    method:method,
                    url:url,
                    data: {
                        logindata: inputData
                    }
                })
            }

            login(formdata){
                return this.methodGet('get','user/logs/login.php',formdata)
            }
        }

app.js

 import { Account } from "./classes/account.js";
    let account = new Account();

    let form  = document.getElementById('form');

    form.addEventListener('submit',event=>{
        event.preventDefault();
        let formdata = new FormData(this);
        account.login(formdata).then((response)=>{console.log(response.data)})
    },true);

Now let me explain what's happening. Whenever you make a request, it's an async task, so axios will return you a promise. A promise will have states (pending, resolved, rejected). After sending the request the promise returned by the axios will have state pending until response is got. If response is successful the then the state will go to resolve(then), or else reject(catch).

So only when you will have your response back, the promise state will go to resolve and using then you can access your response, if the state of the promise in pending you will get undefined because you literally don't have the response yet..

Therefore wait till you have response. Then print(console.log) it.

I hope it helps.