Vue.js component only updating after browser page refresh

Question

So I am still quite new to Vue.js or any reactive framework for that matter.

I have a component that I need to have update whenever a change is made. The idea is that it is taking a balance from a specific login.

<li :key="balance">Balance {{ balance }}</li>

data() {
    return {
      games: [],
      balance: '101',
      error: ''
    }
}

async created() {
    try{
      this.balance = await WalletService.getBalance();
    } catch(err){
      console.log(err.message);
    }
  }

From my own debugging, it looks like the created() function is not being called after my router.push() when the user logs in. How can I ensure that created() is called after router.push

So when I switch from created() to mounted() I still have the same issue, but I now get an error in the console "Unchecked runtime.lastError: The message port closed before a response was received." — LukeR97
– LukeR97, Commented Apr 17, 2020 at 14:36

Matt · Accepted Answer · 2020-04-17 17:28:19Z

2

Remove the async keyword from created().

Although lifecycle methods can perform asynchronous code, the lifecycle itself is synchronous.

answered Apr 17, 2020 at 17:28

Matt

3,1903 gold badges35 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Vue.js component only updating after browser page refresh

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related