Cha*_*hai 6 javascript import export ecmascript-6 reactjs
我想重新导出整个模块并仅覆盖重新导出模块的特定功能.但是,当已经重新报告相同的函数时,似乎不会处理导出覆盖函数.
(http://www.ecma-international.org/ecma-262/6.0/#sec-module-semantics-static-semantics-early-errors,'如果ModuleItemList的ExportedNames包含任何重复条目,则为语法错误. ")
如果我只想覆盖重新导出模块中的特定函数或方法,那么我的方法背后的动机是最小化显式重新导出非常大或长的模块.
有没有办法在es6/es2015中实现我的方法?
我的代码到目前为止:
模块a.js
export class MyFirstStandardClass {
sendMeMessages() {
return `hello, I'm a standard implementation`;
}
}
export function talkToMe() {
return `standard talking: how are you doing?`;
}
Run Code Online (Sandbox Code Playgroud)
模块b.js
import * as StandardModule from 'module-a';
export function talkToMe(condition = true) {
if (condition) {
return `project conditional talking: ${StandardModule.talkToMe()}`;
}
return `project without a condition!`;
}
export * from 'module-a';
Run Code Online (Sandbox Code Playgroud)
模块c.js
import * as MyModule from 'module-b';
import React, { Component } from 'react';
export default class App extends Component {
componentWillMount() {
console.log(MyModule);
this.myFirstStandardInstance = new MyModule.MyFirstStandardClass();
}
render() {
return (
<div>
<label>
Class
</label>
<div>
{ this.myFirstStandardInstance.sendMeMessages() }
</div>
<label>
Function
</label>
<div>
{ MyModule.talkToMe(true) } // returns 'standard talking: how are you doing?'; expected 'project conditional talking: standard talking: how are you doing?'
</div>
</div>
);
}
}
Run Code Online (Sandbox Code Playgroud)
看来我的第一个解决方案应该有效。根据 ECMAScript 规范,本地导出应该具有优先权。(http://www.ecma-international.org/ecma-262/6.0/#sec-getexportednames)
这是 Babel 转译器中的一个问题。更多信息:https://github.com/systemjs/systemjs/issues/1031#issuecomment-171262430
Babel 中的问题: https: //phabricator.babeljs.io/T6967
module-a
您可以在一行中选择要导出的模块。所以在你的module-b.js
你可以这样做:
// export all modules excluding `talkToMe`
export { MyFirstStandardClass, someOtherModule } from 'module-a';
export function talkToMe(condition = true) {
// ...
}
Run Code Online (Sandbox Code Playgroud)
或者您可以导出默认对象并使用 Object.assign() 选择要排除/覆盖的内容:
import * as StandardModule from 'module-a';
const overridenExports = {
talkToMe: function(condition = true) {
// ...
}
}
const myModule = Object.assign({}, StandardModule, overridenExports);
export default myModule;
Run Code Online (Sandbox Code Playgroud)
并导入默认值,例如:
import MyModule from 'module-b';
Run Code Online (Sandbox Code Playgroud)