Question

一切正常，我做了一些更改，现在我的服务未定义。

我的_service文件夹中有一项基本服务

import config from 'config';
import { authHeader } from '../_helpers';

export const subscriptionService = {
    getFullMenu
};

function getFullMenu() {
    const requestOptions = {
        method: 'GET',
        headers: authHeader()
    };

    return fetch(`${config.apiUrl}/subscriptions/fullmealselection`, requestOptions).then(handleResponse);
}

function logout() {
    // remove user from local storage to log user out
    localStorage.removeItem('user');
}

function handleResponse(response) {
    return response.text().then(text => {
        const data = text && JSON.parse(text);
        if (!response.ok) {
            if (response.status === 401) {
                // auto logout if 401 response returned from api
                logout();
                location.reload(true);
            }

            const error = (data && data.message) || response.statusText;
            return Promise.reject(error);
        }

        return data;
    });
}

我有一个基本模块

import subscriptionService from '../_services/subscription.service';

export const subscriptions = {
    namespaced: true,
    state: {
        fullMenu: {}
    },
    actions: {
        getFullMenu({ commit }) {
            commit('fullMenuRequest');
            subscriptionService.getFullMenu()
                .then(
                    items => commit('fullMenuSuccess', items),
                    error => commit('fullmenuFailure', error)
                );
        }
    },
    mutations: {
        fullMenuRequest(state) {
            state.fullMenu = { loading: true };
        },
        fullMenuSuccess(state, items) {
            state.fullMenu = { items: items };
        },
        fullMenuFailure(state, error) {
            state.fullMenu = { error };
        }
    }
}

在应用程序中，当我在模块上调用getFullMenu方法时，它显示cannot read property getFullMenu of undefined

我已经验证它进入模块，如果我在alert（）subscriptionService中说它未定义，则在模块中。我不知道是什么问题。

为进行比较，我的身份验证服务运行正常。我已经比较了两者，对我来说它们似乎相同。

import { userService } from '../_services';
import { router } from '../_helpers';

const user = JSON.parse(localStorage.getItem('user'));
const initialState = user ? { status: { loggedIn: true }, user } : { status: {}, user: null };

export const authentication = {
    namespaced: true,
    state: initialState,
    actions: {
        login({ dispatch, commit }, { email, password }) {
            commit('loginRequest', { email });

            userService.login(email, password)
                .then(
                    user => {
                        commit('loginSuccess', user);
                        router.push('/profile');
                    },
                    error => {
                        commit('loginFailure', error);
                        dispatch('alert/error', error, { root: true });
                    }
                );
        },
        logout({ commit }) {
            userService.logout();
            commit('logout');
        }
    },
    mutations: {
        loginRequest(state, user) {
            state.status = { loggingIn: true };
            state.user = user;
        },
        loginSuccess(state, user) {
            state.status = { loggedIn: true };
            state.user = user;
        },
        loginFailure(state) {
            state.status = {};
            state.user = null;
        },
        logout(state) {
            state.status = {};
            state.user = null;
        }
    }
}

Answer 1

您已将服务导出为命名导出，但您正在将其导入为默认导出。由于不存在默认导出，因此subscriptionService未定义，因此错误cannot read property getFullMenu of undefined

您的出口

export const subscriptionService = {
    getFullMenu
};

您的导入

import subscriptionService from '../_services/subscription.service';

您的导入内容应该是：

import { subscriptionService } from '../_services/subscription.service';

或

您的出口可能是：

 export default {
     getFullMenu
 };

查找：https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export

导入后导出模块未定义

1 个答案: