为什么“出口默认Const”无效?-WhyIs`ExportDefaultConst`invalid?

152  

const is like let, it is a LexicalDeclaration (VariableStatement, Declaration) used to define an identifier in your block.

const类似于let，它是一个LexicalDeclaration (VariableStatement, Declaration)，用于在块中定义标识符。

You are trying to mix this with the default keyword, which expects a HoistableDeclaration, ClassDeclaration or AssignmentExpression to follow it.

您试图将其与默认的关键字混合在一起，该关键字期望一个提升器声明、类声明或赋值表达式跟随它。

Therefore it is a SyntaxError.

因此这是一个语法错误。

If you want to const something you need to provide the identifier and not use default.

如果您想保存一些东西，您需要提供标识符，而不是使用默认值。

export by itself accepts a VariableStatement or Declaration to it's right.

导出本身接受一个可变化的语句或声明。

AFAIK the export in itself should not add anything to your current scope.

AFAIK本身不应该添加任何东西到您当前的范围。

The following is fineexport default Tab;

下面是fineexport默认选项卡;

Tab becomes an AssignmentExpression as it's given the name default ^?

选项卡成为指定名称的指定表达式?

export default Tab = connect( mapState, mapDispatch )( Tabs ); is fine

导出默认选项卡= connect(mapState, mapDispatch)(选项卡);很好

Here Tab = connect( mapState, mapDispatch )( Tabs ); is an AssignmentExpression.

这里选项卡= connect(mapState, mapDispatch)(选项卡);是一个AssignmentExpression。

24  

You can also do something like this if you want to export default a const/let, instead of

如果您想要导出默认的const/let而不是

const MyCompOnent= ({ attr1, attr2 }) => (
Now Export On other Line
);
export default MyComponent

You can do something like this, which I do not like personally.

你可以做这样的事，我个人不喜欢。

let MyComponent;
export default MyCompOnent= ({ }) => (
Now Export On SameLine
);

6  

Paul's answer is the one you're looking for. However, as a practical matter, I think you may be interested in the pattern I've been using in my own React+Redux apps.

保罗的答案就是你要找的。但是，实际上，我认为您可能对我在自己的React+Redux应用程序中使用的模式感兴趣。

Here's a stripped-down example from one of my routes, showing how you can define your component and export it as default with a single statement:

下面是我的一条路线的一个简化示例，展示了如何定义组件并将其导出为默认的语句:

import React from 'react';
import { connect } from 'react-redux';

@connect((state, props) => ({
    appVersion: state.appVersion
    // other scene props, calculated from app state & route props
}))
export default class SceneName extends React.Component { /* ... */ }

(Note: I use the term "Scene" for the top-level component of any route).

(注意:我对任何路径的顶级组件使用术语“场景”)。

I hope this is helpful. I think it's much cleaner-looking than the conventional connect( mapState, mapDispatch )( BareComponent )

我希望这能有所帮助。我认为它比传统的连接(mapState, mapDispatch)(BareComponent)要干净得多。

0  

If the component name is explained in the file name MyComponent.js, just don't name the component, keeps code slim.

如果在文件名MyComponent中解释了组件名。js，只是不要命名组件，保持代码的精简。

import React from 'react'

export default (props) =>
    

        {props.children}