Javascript Ipad同时播放2种声音

Javascript Ipad同时播放2种声音,javascript,reactjs,Javascript,Reactjs,我有以下几点:() 声音来自: <CustomSound soundOn = { this.state.soundOn} /> 停下来再开始。理想情况下,这是一个配乐,我想继续玩,并停止在游戏的后期阶段 这个问题似乎只发生在iPad上。在桌面上的chrome上是绝对好的。解决方案可在以下位置找到: 解决方案位于: import React, { Component } from 'react'; class Action1 extends Component { co

我有以下几点:()

声音来自:

<CustomSound soundOn = { this.state.soundOn} />

停下来再开始。理想情况下,这是一个配乐,我想继续玩,并停止在游戏的后期阶段

这个问题似乎只发生在iPad上。在桌面上的chrome上是绝对好的。

解决方案可在以下位置找到:

解决方案位于:

import React, { Component } from 'react';

class Action1 extends Component {
    constructor(props) {
        super(props);

        this.state = {
            answer1: "",
            answer2: "",
            answer3: "",
            answer4: "",
            answerDisabled: false
        }
    }

    updateStateProperty(el, val) {
        var s = {};
        s[el] = val;
        this.setState(s);
    }

    getAnswer = (e) => {
        let answer = e.target.getAttribute('data-id');
        this.props.checkAnswer(e);

        if(e.target.getAttribute('data-question') == ("option_" + this.props.question.correct_option)){
            this.updateStateProperty(answer, 'correct');
            this.props.setCorrectOn(true);
        }

        else {
            this.updateStateProperty(answer, 'wrong');  
            this.props.setIncorrectOn(true);    
        }

        this.setState({
            answerDisabled: true
        })

        setTimeout(() => {
            this.props.setIncorrectOn(false);
            this.props.setCorrectOn(false);
            this.updateStateProperty(answer, '');
        }, 1000);

        setTimeout(() => {
            this.setState({
                answerDisabled: false
            })
        }, 1500)
    }

    render() {

        return(
            <div className="action">

                    <div className={"action-question " + this.props.catBgColor}>
                        <h3>{this.props.question.question}</h3>
                    </div>

                    <div className={"action-answers " + this.props.catBgColor}>
                        <p className={this.state.answer1 + " " + (this.state.answerDisabled ? 'disable-link' : "")} data-id="answer1" data-question="option_1" onClick={this.getAnswer.bind(this)}>{this.props.question.option_1}</p>
                        <p className={this.state.answer2 + " " + (this.state.answerDisabled ? 'disable-link' : "")} data-id="answer2" data-question="option_2" onClick={this.getAnswer.bind(this)}>{this.props.question.option_2}</p>
                        <p className={this.state.answer3 + " " + (this.state.answerDisabled ? 'disable-link' : "")} data-id="answer3" data-question="option_3" onClick={this.getAnswer.bind(this)}>{this.props.question.option_3}</p>
                        <p className={this.state.answer4 + " " + (this.state.answerDisabled ? 'disable-link' : "")} data-id="answer4" data-question="option_4" onClick={this.getAnswer.bind(this)}>{this.props.question.option_4}</p>
                    </div>

            </div>
        );
    }
}

export default Action1;
import React from 'react';
import Sound from 'react-sound';

class CustomSound extends React.Component {
    render() {
        return (
            <Sound
              url="./assets/sound.mp3"
              playStatus={this.props.soundOn ? Sound.status.PLAYING : Sound.status.STOPPED}
              playFromPosition={0 /* in milliseconds */}
            />
        );
    }
}

export default CustomSound;
this.props.setCorrectOn(true); or this.props.setIncorrectOn(true);
<CustomSound soundOn = { this.state.soundOn} />
soundManager.setup({ ignoreMobileRestrictions: true });