Vuetable-2: 'refresh' of undefined

[anselmobattisti]

inside one componnets im firing a event

where im calling the event

context.$events.fire('paises_reload_vuetable')

the event is working correctly, but, if i go to another router and back to my vuetable and do the same action im reciving this error 'refresh' of undefined

where i listen the event
'paises_reload_vuetable': function () { Vue.nextTick(() => this.$refs.vuetable.refresh()) }

tnks for any help, it's bugging me

[ratiw]

@anselmobattisti I think this is the problem with the router. But I cannot say for sure because I don't use the client-side router myself. It is likely that when you go back, the router does not retain any state or reference of vuetable (probably due to caching), that's why it is undefined. As I mentioned that I don't use client-side router, I really don't know how to solve this one.

[Dri4n]

Hi,

I do not know how you solved it, but the solution for me was ...

https://vuejs.org/v2/guide/components.html#Dynamic-Components

[anselmobattisti]

@ratiw probably your sugestion is the problem, i managed it reloading my page using

  window.location = "/regiao/cidade/cidades";

@Dri4n im going to try this one! its a new feature of vue 2.2 i guess

[luhegi]

simple solution just add ref="vuetable"
in

[DEV-MK-KIM]

I had the same issue this is how I solved

this.$nextTick(() => this.$refs.vuetable.refresh())
this might solve the issue

<vuetable
      ref="vuetable"
      ...
    >

 watch: {
    data() {
      console.log('refreshing table...')
      this.$nextTick(() => this.$refs.vuetable.refresh())
    },
  },