当用户在我的子手游戏中输入错误的猜测时,无法显示different子手的不同图片

当用户输入字母而错误时,不会弹出正确的图像。我能够显示第一张照片(绞架),但除此之外,当用户输入错误的字母时,它不会改变。

我尝试了多种操作,例如导入图片,并且要求进行任何操作,但没有任何效果。还尝试使函数“ updateAttempts()”只是尝试而已,并且发生了相同的事情。

class HangmanPicture extends React.Component {
      updatePicture()
      {
        const image0 = require('./hangman0.png');
        const image1 = require('./hangman1.png');
        const image2 = require('./hangman2.png');
        const image3 = require('./hangman3.png');
        const image4 = require('./hangman4.png');
        const image5 = require('./hangman5.png');
        const image6 = require('./hangman6.png');

          let image = image0;
          if(this.props.updateAttempts === 5)
          image = image1
          else if(this.props.updateAttempts === 4)
          image = image2
          else if(this.props.updateAttempts === 3)
          image = image3
          else if(this.props.updateAttempts === 2)
          image = image4
          else if(this.props.updateAttempts === 1)
          image = image5
          else if(this.props.updateAttempts === 0)
          image = image6

           return (<img src={image} alt="" />)
      }

      render(){

        return(
            <div classname="HangmanPicture">
             {this.updatePicture()}
            </div>
        );


      }
    }

它不会编译带有警告的错误消息,但它可以正常工作

xiaoyuwuxin22 回答:当用户在我的子手游戏中输入错误的猜测时,无法显示different子手的不同图片

首先,您需要绑定updatePicture或使其成为箭头功能。

所以updatePicture应该是:

updatePicture = () => {
  ...
}

此外,必须以某种方式更新this.props.updateAttemps。如果您不更新任何状态,您如何看待updateAttemps将更改并显示正确的图像?

本文链接:https://www.f2er.com/3169609.html

大家都在问