Обновлять Non-Vue-Object при изменении Vuex Store

avatar
drenl
8 апреля 2018 в 01:45
45
0
0

Работаю над музыкальным приложением в Vue и 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.

Как я могу это сделать? Я изучал функцию Store.watch Vuex и, честно говоря, совершенно не понимаю, как ее использовать и если это действительно хороший подход.

РЕДАКТИРОВАТЬ:

"Внешний" модуль (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() );
  },
Источник
acdcjunior
8 апреля 2018 в 02:17
0

Как вы используете ToneJS? В компоненте? Можете ли вы показать код?

drenl
8 апреля 2018 в 03:04
0

@acdcjunior Хорошо, вот как я настроил свой AudioManager. Должен ли я добавить дополнительную информацию?

Ответы (0)