Question

这是我见过的最奇怪的事情之一。这对我来说绝对没有意义。简短的版本是我具有Redux动作创建器功能。如果我将此函数导入到这个特定的组件文件中，它将使从其文件导入的每个函数都不确定。

因此，让我们从文件filterInputModal.actions.js开始。这包含我的Redux动作函数，这些函数使用redux-starter-kit创建：

export const showAddCategoryModal = createAction('showAddCategoryModal');

那是我一直在使用的功能。现在，此功能早已导入我的ManageVideoFilters.js组件中：

import React from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { showAddCategoryModal } from 'store/filterInputModal/filterInputModal.actions';

const ManageVideoFilters = (props) => {
    /* Component logic */
};

/* PropTypes and mapStateToProps */

const mapDispatchToProps = (dispatch) => bindActionCreators({
    showAddCategoryModal: () => showAddCategoryModal() // Done this way to avoid passing in a payload, since certain default event payloads cause Redux to print console errors
});

export default connect(mapStateToProps, mapDispatchToProps)(ManageVideoFilters);

到目前为止，一切都很好。在破坏一切之前，让我们看一下我的filterInputModal.reducer.js Redux reducer，它也是使用Redux Starter Kit创建的：

import { createReducer } from 'redux-starter-kit';
import { showAddCategoryModal } from './filterInputModal.actions';

const initialState = {}; // The initial state for the reducer goes here

const handleShowAddCategoryModal = (state) => {
    /* handle updating the state */
    return state;
};

const actionMap = {
    [showAddCategoryModal]: handleShowAddCategoryModal
};

export default createReducer(initialState, actionMap);

动作图使用动作创建者函数toString（）作为键，然后提供自己的函数来处理状态更新。同样，在这一点上，一切都完美。我们将在几秒钟后回到减速器，首先让我们解决问题。

现在，我们要转到我的VideFileEdit.js组件。如果将以下行添加到此组件，则一切都会中断：

import { showAddCategoryModal } from 'store/filterInputModal/filterInputModal.actions';

那么，它怎么破裂？

现在在filterInputModal.reducer.js中的showAddCategoryModal函数的导入是未定义的。
由于化简将功能用作处理操作的键，因此化简不再能够正确处理操作并更新状态。

虽然变得奇怪。这是我看到的一些奇怪的行为。

如果我将此操作导入任何其他组件，则一切正常。减速器中的导入未更改。
在ManageVideoFilters.js和VideoFileEdit.js中导入该功能都很好。

所以...有人有什么想法吗？这真的很奇怪，对我来说没有任何意义。我从未见过。

谢谢。

Answer 1

正如评论者所说，问题在于递归导入。我的filterInputModal.reducer.js导出了一些常量，这些常量已导入到我的filterInputModal.actions.js中。然后将filterInputModal.actions.js中的操作导入到filterInputModal.reducer.js中。因此，递归导入。

我将常量移到了一个新文件filterInputModal.constants.js和viola中，问题已解决。

导入redux操作会使其他操作未定义

1 个答案: