The Wayback Machine - https://web.archive.org/web/20201204073119/https://github.com/jonashackt/spring-boot-vuejs/issues/96
Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

I have been trying to follow the tutorial, where to place the callRestService () in Hello.vue? #96

Open
gitercn opened this issue Mar 20, 2020 · 1 comment

Comments

@gitercn
Copy link

@gitercn gitercn commented Mar 20, 2020

I'm trying to follow the tutorial, I have created the empty vue project using vue create frontend --no-git and then till this step: Calling a REST service with Axios is simple. Go into the script area of your component, e.g. Hello.vue and add:

import axios from 'axios'

data ();{
  return {
    response: [],
    errors: []
  }
},

callRestService ();{
  axios.get(`api/hello`)
    .then(response => {
      // JSON responses are automatically parsed.
      this.response = response.data
    })
    .catch(e => {
      this.errors.push(e)
    })
}
}

I don't know where exactly this should be added. I created my Hello.vue file under frontend\src\views folder like this and I added it in the src\router\index.js

<template>
  <div class="hello">
    <button class=”Search__button” @click="callRestService()">CALL Spring Boot REST backend service</button>
    <h3>{{ response }}</h3>
  </div>
</template>

<script>
import axios from 'axios'

data ();{
  return {
    response: [],
    errors: []
  }
},

callRestService ();{
  axios.get(`api/hello`)
    .then(response => {
      // JSON responses are automatically parsed.
      this.response = response.data
    })
    .catch(e => {
      this.errors.push(e)
    })
}
}
</script>

But the npm run build gives me this error:

C:\gitercn1\spring-boot-vuejs-copy\frontend\src\views\Hello.vue: 'return' outside of function (13:4)

  11 |
  12 |   data ();{
> 13 |     return {
     |     ^
  14 |       response: [],
  15 |       errors: []
  16 |     }
@fuatkarakus
Copy link

@fuatkarakus fuatkarakus commented May 17, 2020

You should use data () { instead of data ();{ .

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants
You can’t perform that action at this time.