Магазин Vuex не определен в промежуточном программном обеспечении NUXT

Я практикую NUXT, и из учебника он хорошо работает. мой сбой при входе в промежуточное ПО NUXT. логика заключается в том, что если страница перенаправляется на другую страницу, она войдет в промежуточное ПО и получит результат с помощью axios.

промежуточное ПО / search.js

import axios from 'axios';

export default function ({ params, store }) {
    console.info(store)

    return axios.get(`https://itunes.apple.com/search?term=~${params.id}&entity=album`)
        .then((response) => {
            console.info(response.data.results);
            store.commit('add', response.data.results)
        })
}

при вводе здесь store.commit('add'... приведет к

Cannot read property 'commit' of undefined

когда я повторяю commit = undefined.

Что мне не хватает? Я уже пробовал this.$store.commit(...), пока не определился.

VUEX

магазин / index.js

import Vuex from 'vuex'

const createStore = () => {
  return new Vuex.Store({
    state: {
      albums: []
    },
    mutations: {
      add (state, payload) {
        state.albums = payload
      }
    }
  })
}

export default createStore

спасибо, сэр, что поправили мой вопрос

Winston Fale 01.05.2018 18:42

не нужно yenmar в nuxt, он уже добавлен. перезапуск локального сервера исправил проблему

Winston Fale 02.05.2018 17:09
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
11
2
14 380
2

Ответы 2

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

остановите свой сервер разработки ctrl + C

затем перезапустите свой сервер разработки

npm run dev

тогда VUEX будет теперь виден в промежуточном программном обеспечении tnx

Не похоже, что dev-сервер перестраивает хранилище vue, это заставило меня пару часов почесать затылок ... smh

lasec0203 15.05.2018 08:03

У меня тоже сработал перезапуск Dev Server. Похоже, что Vuex не перезагружается при внесении изменений.

Запустите npm run dev, и он должен работать.

Другие вопросы по теме