Force Scrollspy to update with new options

I haven’t found a way to force Scrollspy to update with new options. My offset for instance, can change. I have the value saved in a store’s state. With this implementation, when the value of the offset changes in the store, it keeps being the original one set when calling Vue.use(Scrollspy, ...) for the first time. What am I missing?

<template>
  <nav class="navigation no-print">
    <ul
      v-scroll-spy-active
      v-scroll-spy-link>
      <li
        v-for="section in sections"
        :key="section.id">
        <a :href="`#${section.id}`">{{ section.heading }}</a>
      </li>
    </ul>
  </nav>

</template>

<script>
// Scrollspy
import Scrollspy, { Easing } from 'vue2-scrollspy'
import Vue from 'vue'
import store from '../store'

Vue.use(Scrollspy, {
  easing: Easing.Cubic.InOut,
  offset: store.state.scrollSpyOffset
})

export default {
  name: 'Navigation',
  props: {
    sections: {
      type: Array,
      default: () => []
    }
  }
}
</script>

[jdvivar]

@ibufu it works in your demo! Thanks so much for the demo! I used similar code and didn’t work for me, but I’ll reconsider.

[ibufu]

@jdvivar Is this demo helpful?