Question

我正在创建一个记忆游戏React app。显示狗的12个图像，每个图像具有不同的图像。每次单击一个时，它们的位置都会被洗牌。如果您在当前游戏中多次单击同一图像，则会丢失并重置游戏。如果你单击所有12而不点击任何两次，你就赢了。

除了胜利条件外，一切似乎都在起作用。我想要发生的是如果得分等于12，那么得分和猜测将被重置，它将显示一条消息，表明你赢了。目前，一旦我达到12分，没有任何事情发生，游戏继续。由于没有更多独特的图像，我在12日之后点击的任何图像都会导致丢失。我在npm没有错误。我在这里做的不正确吗？

以下是与此逻辑相关的相关代码。

class GameArea extends Component {
  state = {
    score: 0,
    guessed: [],
    message: ""
  }

  handleClick(e) {
    const clicked = e.target.dataset.id
    if (this.state.guessed.indexOf(clicked) > -1) {
      this.setState({
        score: 0,
        guessed: [],
        message: "You lose!"
      })
    } else if (this.state.score === 12) {
      this.setState({
        score: 0,
        guessed: [],
        message: "You win!"
      })
    } else {
      this.setState({
        score: this.state.score + 1,
        guessed: this.state.guessed.concat(clicked),
        message: ""
      })
    }
  }

Answer 1

我想您要检查分数是===11而不是12。这是因为你计算分数的方式。在第12次点击时，this.state.score等于11。然后你的else块会将其设置为12。在您第13次点击时，this.state.score在运行循环时等于12，但您重新点击了一张图片，因为您只有12张图片。

如何为记忆游戏创建if / else if / else语句的获胜条件

1 个答案: