VS2017 中 React Connected Component 出现奇怪的 Intellisense 错误

Question

我将 this .jsx 连接组件作为 .js 文件拉入我的 React-Redux 项目中，并且遇到了奇怪的错误，而我的任何其他组件都没有。

例如，这里的类名显示为灰色，并显示一条消息“从不使用局部变量 SignupVerify”，即使我将下面的 SignupVerify 导出为连接组件。

class SignupVerify extends Component
{..}

然后，在我的导出语句中，结束分号抛出错误：“} 预期”：

export default connect(mapStateToProps, actions)(SignupVerify);

我已经检查过，我的所有括号都在适当的位置闭合，并且 Intellisense 可以识别它。

这里也给我报错：

function mapStateToProps(state){
        return {
            errorMessage: state.auth.error,
            signup: state.auth.signup 
    }
} 

告诉我它希望我关闭第一个大括号。

在错误列表控制台中，我看到 ESLint:Component Definition is Missing Display Name。

有人知道这一切的背后是什么吗？

Answer 1

您的代码似乎没有任何问题。对我来说，Intellisense 工作得很好。我猜你有一个 ESLint 设置，它强制你为你的组件定义一个 displayName 。

React 的虚拟 DOM 使用显示名称来命名组件。您可以在 Chrome 的 React Developer 工具中看到这些显示名称。

尝试这样做：

class SignupVerify extends Component {
  static displayName = 'SignupVerify';

  constructor(props) {
  ...

或者在你的类定义下

SignupVerify.displayName = 'SignupVerify';