Value not updating from axios response in vue

Viewed 584

I am not able to update the object temp after the axios call.

Please help.

This is whole code. I have used the component in vue. I am very new to vue and components.

Below is app.js

require('./bootstrap');

window.Vue = require('vue');

import axios from 'axios';
window.axios = axios;

Vue.component('shipping-address', require('./components/ShippingAddress.vue'));

const app = new Vue({
    el: '#app',
});
export default app;
<div id="app">
    <shipping-address ></shipping-address>
</div>
<template>
  <div>
    SName: <span>{{temp}}</span>                    
  </div>
</template>
<script>
export default {
  data(){
    return{
        temp:'a'
    }
  },
  mounted(){
      this.fetchArticles();
  },
  methods:{
      fetchArticles() {
          this.temp = 'b'
          const vm = this;
            axios.get('user/addresses')
            .then(response=>{this.temp = 'c';})
            .catch( error => console.log(error));
        },
  }
}
</script>
1 Answers

I resolved the answer.

By mistake i included app.js two times. One in footer blade file and one in the blade file itself.

Related