Vue-slider-component: this.$refs.vue_slider.refresh is not a function

[yusupprog]

Hi.

this.$refs.vue_slider.refresh is not a function

throwing this error although I checked that this.$refs.vue_slider is a VueComponent and has a refresh method

[NightCatSama]

If there is no code, I can hardly know where the error occurred.

[yusupprog]

Hi. I'm using ref in v-for that's why it returns array instead of a single ref.
Vue puts refs in v-for in array even if ref name is unique so
now I have to take ref from first offset of the array

[shi-yan]

I saw the same issue,

my code

<SidebarMenuItem v-for="item in menu.items" :ref="'menu_'+item.id" v-bind:key="item.id" v-bind:item="item" v-on:open="onItemOpen" v-on:loadPage="onLoadPage" v-bind:class="{'menu-active':item.id === currentActive}"> </SidebarMenuItem>

vue creates an array, instead of an object associated to menu_1, I have to access it via

this.$refs.menu_1[0].openProject(refId)

[NightCatSama]

You used it wrong, should be ref="menus" and this.$refs.menus[0].fn()

[udonmai]

To sum it up, if in v-for, you assign a string to ref as ref="string", we have to refer to the ref by this.$refs.string[index]. While if you assign a dynamic string to ref as :ref="item.id", you could refer to the ref by this.$refs[item.id][0].

Here what is tricky is that, as @shi-yan mentioned, vue generates an array for even a unique ref.