Как передать asyncData в Vuex Store? - PullRequest
Новая
       17

Как передать asyncData в Vuex Store?

0 голосов
/ 30 марта 2019

В настоящее время я загружаю некоторые данные из базы данных. Я не хочу, чтобы сервер обрабатывался таким образом, чтобы их можно было проиндексировать для SEO в asyncData на странице. 

asyncData() {
  return firebase.firestore().collection('Programms').get().then((querySnapshot) => {
    const programms = [];
    querySnapshot.forEach((doc) => {
        const programm = doc.data();
        programm.id = doc.id;
        programms.push(programm)
    })
    return { programms: programms};
  })

Однако я бы хотелпреобразовать это в мой магазин vuex.

Я знаю, что мог бы сделать это: 

const actions = {
    async nuxtServerInit({ commit }) {
        firebase.firestore().collection('Programms').onSnapshot((querySnapshot) => {
            const programms = [];
            querySnapshot.forEach((doc) => {
                const programm = doc.data();
                programm.id = doc.id;
                programms.push(programm)
            })
            console.log('loaded Programms', programms)

            commit('setProgramms', programms);
        })
    },
}

Но таким образом данные будут загружаться для каждого маршрута в моем приложении.Я не хочу загружать эти данные только на некоторых страницах, где я также отображаю их, поэтому я не загружаю их без необходимости.

Как я могу сделать это в Vuex?

1 Ответ

1 голос
/ 31 марта 2019

Как говорит @aldarund, метод выборки - это именно то, что вам нужно. 

fetch ({ store, params }) {
    return firebase.firestore().collection('Programms').get().then((querySnapshot) => {
    const programms = [];
    querySnapshot.forEach((doc) => {
        const programm = doc.data();
        programm.id = doc.id;
        programms.push(programm)
    })
    .then(() => {
      store.commit('setPrograms', programms)
    })
  }

См. Документы здесь .

...