[Vuejs]-Vue JS Data not updating

1πŸ‘

βœ…

I don’t know which version of vue-resource you are using. Maybe your version is old. According to this github page when you use this.$http.get() in version "vue-resource": "^1.5.3", you must use response.body to get data. I am not sure that this is the reason that your code is not working, But this code works fine for me:

<template>
<h1>API page</h1>
</template>

<script>
export default {
  name: "Apicall",
  data() {
    return {
      properties: [],
      loading: true,
      showProgressBars: true,
      debugText: 'This is start'
    }
  },
  methods: {
    get() {
      const success = (r) => {
        console.log(r.body);
        this.properties = r.body
        this.loading = false
        this.debugText = 'api has returned success'
      }
      const error = (r) => {
        console.error(r)
      }

      var resourceUri = `https://jsonplaceholder.typicode.com/users`

      this.$http
          .get(resourceUri)
          .then(success, error)
    },
  },
  mounted: function() {
    this.get();
  }
}
</script>

<style scoped>

</style>

Maybe for your data, you should call r.body.data.properties, But I am not sure.

πŸ‘€hamid-davodi

Leave a comment