如何解决'语法错误意外令牌，预期为“}”

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()函数进行设置。