如何解决 ' 语法错误 意外标记，预期的 “}” '

Question

我正在使用 react native 编写一个应用程序。这是我第一次这样做。我熟悉类和函数作为contruct。

到目前为止一切正常，但现在由于某种原因代码无法编译并抛出此错误

语法错误：/ggProject/App.js：意外的标记，预期的"}" （119：23）

我一直在试图弄清楚出了什么问题，但我找不到错误。行119:23位于构造函数的第一个"{"中。

class Cartas extends Component {
constructor(props) {
    super(props);
    state = {
        carta: 0
    };
}
nextCard = () => {
    var y = this.state.carta + 1;
    this.setState({carta: y })
    if(this.state.carta === 3) {Alert.alert('se activaron')}
}
displayCarta() {
    if(this.state.carta <= 2){
        if (this.state.carta%4 == 0) {
            return <CTodos players={this.props.players} changePage={this.props.changePage} next={this.nextCard}/>
        } else if (this.state.carta%4 == 1) {
            return <CSecuencia changePage={this.props.changePage} next={this.nextCard} />
        } else if (this.state.carta%4 == 2) {
            return <CPregunta  changePage={this.props.changePage} next={this.nextCard} />
        }
    }else {
        if (this.state.carta%4 == 0) {
            return <CTodos players={this.props.players} changePage={this.props.changePage} next={this.nextCard}/>
        } else if (this.state.carta%4 == 1) {
            return <CSecuencia changePage={this.props.changePage} next={this.nextCard} />
        } else if (this.state.carta%4 == 2) {
            return <CPregunta  changePage={this.props.changePage} next={this.nextCard} />
        }else if (this.state.carta%4 == 3) {
           return <CReto  changePage={this.props.changePage} next={this.nextCard} />
       }
    }
}
render() {
    return (
            this.displayCarta()
    )
}
}

Answer 1

从提供的片段来看，您没有添加结束}这是一个语法错误。它应如下所示：

class Cartas extends Component {
  constructor(props) {
      super(props);
      this.state = {
        carta: 0
      };
  }
}

将 lint 工具与关系文本编辑器插件一起添加到项目中将帮助您实时拾取这些语法错误。

Answer 2

我认为您的组件应该喜欢这样

class Cartas extends Component
    state = {
        carta: 0
    }
}

指针

1. 您不使用构造函数进行初始化（至少它们没有在文档中指定这样做）
2. 您无法通过 this 设置状态。您可以像上面所做的那样设置状态，然后只能使用 setState() 函数设置状态