CODEWITHSUNDEEP
javascriptvue.js
user12288003
user12288003

Reputation: 339

Getting Parsing error: Unexpected token, expected "," in Vue

I am trying to do an axios request but whatever I do I get the same error message.

The message is:

Parsing error: Unexpected token, expected ",". The error points at axios.get (it points at the dot between "axios" and "get" in the error message). It gives the same message if I put something like console.log in the code.

I am basically just using a regular default vue project and the only thing I have done is to add the following code in HelloWorld.vue.

<script type="text/javascript">
   import axios from 'axios';
 //  const axios = require('axios');

  export default {
    name: 'HelloWorld',  //  console.log("hi"),
    props: {
      msg: String //response
    },
    methods: {
      axios.get('https://swapi.co/api/people/1')
        .then(function(response){
            console.log(response)
        })
    }
  }

</script>

Can someone please tell me why this error keeps coming up, I am guessing this is pretty simple but I am losing my mind at this point. Thank you

Upvotes: 1

Views: 6293

Answers (2)

Adam Specker
Adam Specker

Reputation: 422

You won't be able to access your axios method, since it isn't actually being declared as a function. You can write vue methods in two ways, both equivalent (to my knowledge).

export default {
  data() {
    item: []
  },
  methods: {
    getStarWarsCharacters() {
      // axios call goes here
    }
  }
}

Other way is like this:

export default {
  data() {
    item: []
  },
  methods: {
    getStarWarsCharacters: () => {
      // axios call goes here
    }
  }
}

I suspect that if you write it in the first way, Vue is actually converting to the second.

Upvotes: 1

Fardin Ahsan
Fardin Ahsan

Reputation: 91

axios must be globalized in your root file.

    const axios = require('axios');
global.axios = axios;

Upvotes: 0

Related Questions