在 modules
文件夹中设置 redux 文件:
\modules
\application
\actions
application.js
index.js
\records
application.js
\reducers
application.js
index.js
我的application
记录是导出默认值的不可变记录:
import {Record, List, Map, Set, OrderedMap} from 'immutable';
const Application = new Record({
'loaded': false,
});
export default {
Application,
};
在我的 reducers/application.js
文件中,我在导入时解构导出:
import {Record, List, Map, Set, OrderedMap} from 'immutable';
import { Application } from '../records/application';
import
APP_INITIALIZE
from '../actions';
const initialAppState = new Application();
export default (state = initialAppState, action )=> {
switch (action.type) {
case APP_INITIALIZE:
return state
.set('loaded', true);
default:
return state;
}
};
我希望它能够工作,因为 records/application.js
导出一个对象,其中包含不可变的记录。但是,我收到以下错误:
application.js:10 未捕获类型错误:_records_application__WEBPACK_IMPORTED_MODULE_1__.Application 不是构造函数
当我检查 reducers/application.js
中的 Application
对象时,我得到 undefined
。
我的 .babelrc
文件如下所示:
{
"presets": [
"@babel/preset-react",
["@babel/preset-env", {
"useBuiltIns": "usage",
"corejs": 2,
"targets": {
"firefox": "64",
"chrome": "58",
"ie": "11",
"electron": "4"
},
}]
],
"plugins": [
"@babel/plugin-proposal-class-properties"
]
}
我在这里做错了什么?
最佳答案
不幸的是,无法导入作为对象的默认导出并同时对其进行解构,因为该语法与导入命名导出的语法冲突从另一个文件。您的
import { Application } from '../records/application';
尝试从其他文件导入名为Application
的命名导出,但它没有这样的命名导出,因此事情失败了。
import
后面的 {
表示您正在导入名为的内容;没有 {
表示您正在导入默认值。
您可以在下一行导入默认值和解构:
import FullApplication from '../records/application';
const { Application } = FullApplication;
如果该其他文件中确实没有任何其他内容,则让 Application
记录默认导出会更有意义:
const Application = new Record({
'loaded': false,
});
export default Application;
import Application from '../records/application';
或者您可以将Application
导出命名为,并且没有默认导出:
export const Application = new Record({
'loaded': false,
});
import { Application } from '../records/application';
关于JavaScript ES6 : import destructuring not working,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59548979/