Question

使用Vue＆amp ;;中的音乐应用程序ToneJS，我将我的ToneJS对象（即：new Tone.Synth()等）放在Vue实例/组件之外的模块上。

所以我的商店看起来像这样：

state: {
  tracks: [
    { 
      synthType: 'triangle',
      gain: 0.5,
      tune: ["beep", "boop", "bleep"]
    },
    {   
      synthType: 'sine',
      gain: 0.9,
      tune: ["boop", "boop", "beep"]
    },
  ]    
}

当商店中的tracks对象以某种方式发生变化时（例如，用户更改了第1个轨道上的增益），我需要更新ToneJS合成器上的设置。

我该怎么做？我一直在研究Vuex的Store.watch功能，我坦率地对如何使用它以及如果实际上是一个好方法感到困惑。< / p>

编辑：

＆＃34;外部＆＃34;模块（AudioManager，导入为AM）目前只是一个包含两个数组synths和gains的对象文字。应用的父组件在dispatch上运行此created：

  initializeAudioManager: context => {
    context.state.tracks.forEach( (track, index) =>  {
      let trackSynth = new Tone.Synth()
      trackSynth.oscillator.type = track.synthType
      AM.synths.push(trackSynth)
      let trackGain  = new Tone.Gain(track.gain)
      AM.gains.push(trackGain)
    })
    AM.synths.forEach( (synth, i) => synth.connect(AM.gains[i]) );
    AM.gains.forEach( (gain, i) => gain.toMaster() );
  },

当Vuex Store更改时更新非Vue-Object

0 个答案: