我正在嘗試將我制作的 HTML/Javascript 鼓包添加到我的 Gatsby 站點(diǎn)。當(dāng)前，按下鍵時不會播放聲音，并且從 audio.play() 返回的承諾掛在“待定”處。我已經(jīng)讓它與基本的 HTML/JS 以及標(biāo)準(zhǔn)的 React 應(yīng)用程序一起使用。但是當(dāng)試圖將它合并到我的 Gatsby 站點(diǎn)時，我遇到了以下返回的承諾問題，并且沒有聲音播放。[[PromiseStatus]]: "pending"[[PromiseValue]]: undefined整個 Gatsby 站點(diǎn)的 git repo 在這里（目前只有開發(fā)版本）https://github.com/mfuller22/FullerStackProgramming我遇到問題的特定頁面的目錄在這里https://github.com/mfuller22/FullerStackProgramming/tree/master/src/pages/Projects/DrumKit我將在幾個小時內(nèi)添加我的 React 代碼。我目前沒有它。componentDidMount() {      document.addEventListener("keydown", this.handleKeyDown.bind(this));}handleKeyDown = (event) => {  if (event.keyCode === parseInt(this.props.id, 10))    this.playSound()}playSound = () => {  const audio = document.getElementById('sound'+this.props.id);  const key = document.querySelector(`div[data-key="${this.props.id}"]`);  audio.currentTime = 0;  console.log(audio)  var playPromise = audio.play();  console.log(playPromise)  playPromise.catch(error => {    audio.play();  });  key.classList.add('playing');};    render() {  const { id, letter, sound } = this.props  return (    <div      id={'key'+id}      data-key={id}      onClick={() => this._playSound}      onKeyDown={() => this._playSound}      onTransitionEnd={() => this._onTransitionEnd}      className="key">      <kbd>{letter}</kbd>      <span className="sound">{sound}</span>      <audio id={'sound'+id}>        <source src={sound} type="audio/wav" />      </audio>    </div>  );}我希望以已解決狀態(tài)返回承諾，但目前承諾狀態(tài)為待定，并且承諾值未定義。