Dynamic rerender

[lukas-pierce]

When toggle show true → false → true not rerender visualization, and console warnings:

Construction of AnalyserNode is not useful when context is closed.
Connecting nodes after the context has been closed is not useful.
Connecting nodes after the context has been closed is not useful.

<template>
   <div>
     <audio ref="audio" src="...">
     <av-line v-if="show" ref-link="audio"/>
     <button @click="show = !show">toggle</button>
   </div>
</template>

<script>
export default {
   data() {
      return {
         show: true
      }
   }
}
</script>

In my other case I need dynamic changing visualization component I had same problem:

<template>
  <div>
    <audio ref="audio" src="...">
    <av-line v-if="av === 'line'" ref-link="audio" />
    <av-bars v-else-if="av === 'bars'" ref-link="audio" />
    <av-circle v-else-if="av === 'circle'" ref-link="audio" />
    <select v-model="av">
       <option value="line">line</option>
       <option value="bars">bars</option>
       <option value="circle">circle</option>
    </select>
  </div>
</template>

<script>
export default {
  data() {
    return {
      av: 'line'
    }
  }
}
</script>

Thanks for fast solving 😌

[lukas-pierce]

Temp Stub (((

watch: {
  av () {
    window.location.reload() // todo wait for fix https://github.com/staskobzar/vue-audio-visual/issues/21
  }
},

[staskobzar]

Hello, Yes, it is confirmed. I will work on it. Do not know how long it will take considering my work load. Will keep up. Thansk