Javascript 通过设置状态禁用模式并不总是有效

我有两个情态动词：

视图：

在这两种模式中，函数的调用方式相同

在

上一切正常。Visible设置为false，模态消失

问题出在

上。不起作用。它不会返回任何错误，模式也不会消失

有什么问题吗？也许setState不能正常工作，但如果是，为什么

编辑：

const{width，height}=Dimensions.get（“窗口”）；
导出默认类playScreen扩展组件{
建造师（道具）{
超级（道具）
此.state={
计时器：3，
游戏开始：0，
gameStop:false，
废容器：[]，
废文本：“”，
赢:0,，
损失：0，
莫代尔：错，
水平设置：[]，
联机颜色：{
颜色：“fff”
}, 
颜色计数器：0，
莫达克罗斯：错，
objectArray:[]，
米利：0
}
}
componentDidMount（）{
this.onLoadHandler（）
这个文件名为
这是getCategories（）
}
shouldComponentUpdate（）{
如果（this.state.mili！==0）返回false
else{return true}
}
onLoadHandler=（）=>{
常量计时器=设置间隔（（）=>{
this.setState（{timer:this.state.timer-1}）
如果（this.state.timer{
this.setState（{gameStop:true}）
设置超时（（）=>{
this.props.navigation.navigate（'home'））
console.log（'嘿，我在工作'）
}, 1000)
}
gameReplay=（）=>{
常量级别=this.props.navigation.state.params.level
this.setState（{modalClose:false，modal:false}）
this.props.navigation.push（'play'，{level:level}）
}
游戏开始=（）=>{
常量级别=this.props.navigation.state.params.level
常量计时器=设置间隔（（）=>{
const{objectArray，win，colorCounter，wasteContainer，gameStop，gameStart}=this.state
this.setState（{gameStart:gameStart+1，colorCounter:colorCounter+1}）
如果（级别=='level1'？颜色计数器>=40:colorCounter>=90）{
const colors=wasteContainer[objectArray[win]。category\u-uid]。color！=''&&wasteContainer[objectArray[win]。category\u-uid]。color！==null&&wasteContainer[objectArray[win]。category\u-uid]。颜色：'\35; fff'
常数更新颜色=
{
颜色：颜色
}
this.setState（{onlineColor:updateColor}）
}
if（objectArray.length！==0&&win>=objectArray.length）{
this.setState（{gameStop:true，modal:true}）
清除间隔（计时器）
//this.miliasecondhandler（）
}
else if（objectArray.length==0）{
清除间隔（计时器）
this.setState（{gameStart:0}）
}
如果（游戏停止）{
清除间隔（计时器）
//this.miliasecondhandler（）
console.log（'hey-im-working-game-stop'）
}
}, 100)
}
gameHandler=async（arg）=>{
const{objectArray，win，gameStart}=this.state
如果（objectArray.length>win&&gameStart>0）{
const wasteId=objectArray&&objectArray[win]&&objectArray[win]。id？objectArray[win]。id:未定义
if（objectArray[win].category\u uid==arg）{
var setObj=objectArray[win]；
setObj.good_answer++；
if（wasteId）等待firebase.database（）.ref（`wastes/${wasteId}'）.set（setObj）；
这是我的国家(
{
win:win+1，颜色计数器：0，
联机颜色：{
颜色：“fff”
}
})
}
否则{
this.setState（{gameStop:true，modalClose:true}）
//this.miliasecondhandler（）
设setObj=objectArray[win]；
setObj.错误的回答++；
if（wasteId）等待firebase.database（）.ref（`wastes/${wasteId}'）.set（setObj）；
}
}
}
getCategories=async（）=>{
const data=await firebase.database（）.ref（'categories'）；
等待数据。一次（'值'，（快照）=>{
this.setState（{wasteContainer:snapshot.val（）}）
})
};
getwasteText=async（）=>{
const data=await firebase.database（）.ref（'wastes'）；
等待数据。一次（'值'，（快照）=>{
this.setState（{wastext:Object.values（snapshot.val（））}）；
这个文件名为getLevel（）
})
};
getLevel=async（）=>{
const data=await firebase.database（）.ref（`level/${this.props.navigation.state.params.level}`）；
等待数据。一次（'值'，（快照）=>{
this.setState（{levelSetting:snapshot.val（）}）
这是setLevel（）
})
};
setLevel=（）=>{
常量级别=this.state.levelSetting
const uids=['AGHJgv7GFYKYUG'、'q23rfhgbrYKYUG'、'njyhtd6y7GFYKYUG'、'AGFDSGGAGGYKYUG'、'8ikr6t7dsgYKYUG']；
for（设i=0；ix.category\u uid==uids[i]
x=>x.category\u uid==uids[i]&&x.level\u uid==this.props.navigation.state.params.level
)
让shufflearl=this.shufflearlay（s）
让res=this.sorting（shufflear，level.settings[i]）
this.setState（{objectArray:[…this.state.objectArray，res.flat（）.flat（）].flat（）}）
让shuffleArr1=this.shuffleArray（this.state.objectArray）
this.setState（{objectArray:shufflearl1
<Modal visible={this.state.modal} replay={this.gameReplay} close={this.gameStop} />
<LoseModal visible={this.state.modalClose} replay={this.gameReplay} close={this.gameStop} />

gameReplay = () => {
    const level = this.props.navigation.state.params.level
    this.setState({ modalClose: false, modal: false })       
    this.props.navigation.push('play', { level: level })               
}

const { width, height } = Dimensions.get("window");
export default class playScreen extends Component {
    constructor(props) {
        super(props)
        this.state = {
            timer: 3, 
            gameStart: 0,
            gameStop: false, 
            wasteContainer: [], 
            wasteText: '', 
            win: 0, 
            loss: 0, 
            modal: false, 
            levelSetting: [], 
            onlineColor: {
                color: "#fff"
            }, 
            colorCounter: 0, 
            modalClose: false, 
            objectArray: [],
            mili:0
        }
    }

    componentDidMount() {
        this.onLoadHandler()
        this.getwasteText()
        this.getCategories()
    }

    shouldComponentUpdate(){
        if(this.state.mili !== 0)return false
        else {return true }
    }


    onLoadHandler = () => {
        const Timer = setInterval(() => {
            this.setState({ timer: this.state.timer - 1 })
            if (this.state.timer <= 0) {
                clearInterval(Timer)
                this.gameStart()
            }
        }, 1000)
    }

    gameStop = () => {
        this.setState({ gameStop: true })
        setTimeout(() => {
            this.props.navigation.navigate('home')
            console.log('hey im working')
        }, 1000)
    }

    gameReplay = () => {
        const level = this.props.navigation.state.params.level
        this.setState({ modalClose: false, modal: false })       
        this.props.navigation.push('play', { level: level })               
    }

    gameStart = () => {
        const level = this.props.navigation.state.params.level

        const Timer = setInterval(() => {
            const { objectArray, win, colorCounter, wasteContainer, gameStop, gameStart } = this.state
            this.setState({ gameStart: gameStart + 1, colorCounter: colorCounter + 1 })
            if (level === 'level1' ? colorCounter >=40 : colorCounter >= 90) {
                const colors = wasteContainer[objectArray[win].category_uid].color !== '' && wasteContainer[objectArray[win].category_uid].color !== null && wasteContainer[objectArray[win].category_uid].color !== undefined ? wasteContainer[objectArray[win].category_uid].color : '#fff'

                const updateColor =
                {
                    color: colors
                }
                this.setState({ onlineColor: updateColor })

            }
            if (objectArray.length !== 0 && win >= objectArray.length) {
                this.setState({ gameStop: true, modal: true })
                clearInterval(Timer)
                // this.miliSecondHandler()

            }
            else if (objectArray.length === 0) {
                clearInterval(Timer)
                this.setState({ gameStart: 0 })
            }
            if (gameStop) {
                clearInterval(Timer)
                // this.miliSecondHandler()
                console.log('hey im working game stop')
            }
        }, 100)

    }

    gameHandler = async (arg) => {
        const { objectArray, win, gameStart } = this.state
        if (objectArray.length > win && gameStart > 0) {
            const wasteId = objectArray && objectArray[win] && objectArray[win].id ? objectArray[win].id : undefined

            if (objectArray[win].category_uid === arg) {
                var setObj = objectArray[win];
                setObj.good_answer++;
               if(wasteId) await firebase.database().ref(`wastes/${wasteId}`).set(setObj);
                this.setState(
                    {
                        win: win + 1, colorCounter: 0,

                        onlineColor: {
                            color: "#fff"
                        }
                    })
            }
            else {
                this.setState({ gameStop: true, modalClose: true })
                // this.miliSecondHandler()
                let setObj = objectArray[win];
                setObj.wrong_answer++;
                if(wasteId) await firebase.database().ref(`wastes/${wasteId}`).set(setObj);
            }
        }

    }

    getCategories = async () => {
        const data = await firebase.database().ref('categories');
        await data.once('value', (snapshot) => {
            this.setState({ wasteContainer: snapshot.val() })
        })
    };

    getwasteText = async () => {
        const data = await firebase.database().ref('wastes');
        await data.once('value', (snapshot) => {
            this.setState({ wasteText: Object.values(snapshot.val()) });
            this.getLevel()
        })
    };

    getLevel = async () => {
        const data = await firebase.database().ref(`level/${this.props.navigation.state.params.level}`);
        await data.once('value', (snapshot) => {
            this.setState({ levelSetting: snapshot.val() })
            this.setLevel()
        })
    };


    setLevel = () => {
        const level = this.state.levelSetting
        const uids = ['AGHJgv7GFYKYUG', 'q23rfhgbrYKYUG', 'njyhtd6y7GFYKYUG', 'AgfdsggagGFYKYUG', '8ikr6t7dsgYKYUG'];
        for (let i = 0; i < uids.length; i++) {

            let s = this.state.wasteText.filter(
                // x => x.category_uid == uids[i]
                x => x.category_uid == uids[i] && x.level_uid === this.props.navigation.state.params.level
            )
            let shuffleArr = this.shuffleArray(s)
            let res = this.sorting(shuffleArr, level.settings[i])
            this.setState({ objectArray: [...this.state.objectArray, res.flat().flat()].flat() })
            let shuffleArr1 = this.shuffleArray(this.state.objectArray)

            this.setState({ objectArray: shuffleArr1 })

        }


    }

    shuffleArray = (arr) => {
        for (let i = arr.length - 1; i > 0; i--) {
            let j = Math.floor(Math.random() * (i + 1));
            let temp = arr[i];
            arr[i] = arr[j];
            arr[j] = temp;
        }
        return arr
    }

    sorting = (array, limit) => {
        const arr = [];
        arr.push(array.splice(0, limit));
        return arr
    }

    miliSecondHandler = async (sec) => {
         if(this.state.modal&&sec&&sec.second&&sec.mili){
            await this.setState({mili:`${sec.second},${sec.mili}`})
        }


    }



    render() {
        const { win, timer, gameStart, onlineColor, objectArray } = this.state
        const text = objectArray && objectArray[win] && objectArray[win].value !== null ? objectArray[win].value : ''
        const categoryUid = objectArray && objectArray[win] && objectArray[win].value !== null ? objectArray[win].category_uid : ''
        const flag = this.state.modal?this.state.modal:this.state.gameStop
        return (
            <SafeAreaView style={styles.safeAreaView}>
                <StatusBar backgroundColor="#104C80" barStyle="light-content" />
                <View style={styles.container}>
                    <TouchableOpacity onPress={() => this.gameStop('back')} style={styles.closeBtn}><Image source={require('../assets/close.png')} style={styles.closeBtnImg} resizeMode="contain" /></TouchableOpacity>
                    <View style={styles.topContainer}>
                        <ImageBackground source={require('../assets/bgimage.png')} style={styles.bgImg} resizeMode='contain'>
                            <Text style={styles.topText}>W worku pozostało:</Text>
                            <Text style={styles.totalItem}>{objectArray.length - win}</Text>
                        </ImageBackground>
                    </View>
                    <View style={styles.timerContainer}>

                        {timer === 0 && objectArray.length ? <Seconds stop={flag} handler={this.miliSecondHandler} styles={styles.secondsLeft}  />:null}
                        <Text style={styles.timerUnit}>{gameStart > 0 ? 'sekund' : ''}</Text>
                    </View>
                    <View style={styles.desContainer}>
                        {timer !== 0 ? <Text style={styles.timerDescribe}>Masz tylko jedną szansę!</Text> : <Text></Text>}    
                        {timer === 0 ? <Text style={[styles.questionText, onlineColor]}>{text}</Text>
                            : <Text style={styles.timer}>{timer}</Text>}
                    </View>
                    <View style={styles.wasteContainer}>
                        <Text style={styles.selectWaste}>Wrzucam do:</Text>
                        <View style={{ alignItems: "center", flexDirection: "row" }}>
                            <BinImage onPress={() => this.gameHandler('AGHJgv7GFYKYUG')} source={bin1} text='PAPIER' />
                            <BinImage onPress={() => this.gameHandler('q23rfhgbrYKYUG')} source={bin2} text='METAL/PLASTIK' />
                        </View>
                        <View style={{ alignItems: "center", flexDirection: "row" }}>
                            <BinImage onPress={() => this.gameHandler('njyhtd6y7GFYKYUG')} source={bin3} text='SZKŁO' />
                            <BinImage onPress={() => this.gameHandler('AgfdsggagGFYKYUG')} source={bin4} text='BIO' />
                            <BinImage onPress={() => this.gameHandler('8ikr6t7dsgYKYUG')} source={bin5} text='RESZTKOWE' />
                        </View>
                    </View>
                    <Modal visible={this.state.modal} seconds={this.state.mili} total={objectArray.length} score={win} replay={this.gameReplay} close={this.gameStop} />
                    <LoseModal visible={this.state.modalClose} categoryUid={categoryUid} wasteText={text} seconds={this.state.mili} total={objectArray.length} score={win} replay={this.gameReplay} close={this.gameStop} />

                </View>
            </SafeAreaView>
        )
    }
}