我有一個父組件，里面有計時器組件。計時器從 15 分鐘開始倒計時直到 0。當我的計時器顯示時間為 0 時，我想觸發提交按鈕事件，提交按鈕在測驗組件內（測驗組件也是父組件的子組件）。我發現當 p 標簽改變時，我可能可以使用 MutationObserver。我不確定這是正確且唯一的方法還是有更好的方法來實現這一目標。父組件：import React, { Component } from 'react';import '../css/App.css'import Quiz from './Quiz';import Timer from './Timer';import { connect } from 'react-redux';import { ActionTypes } from '../redux/constants/actionTypes';import { saveQuizAll, getQuizIndex } from '../commonjs/common.js';const mapStateToProps = state => { return { ...state.quiz, ...state.quizAll } };const mapDispatchToProps = dispatch => ({ onQuizLoad: payload => dispatch({ type: ActionTypes.QuizLoad, payload }), onQuizChange: payload => dispatch({ type: ActionTypes.QuizAnswerAll, payload }), onPagerUpdate: payload => dispatch({ type: ActionTypes.PagerUpdate, payload })});class QuizContainer extends Component { state = { quizes: [ { id: 'data/class1.json', name: 'Class 1' }, { id: 'data/class2.json', name: 'Class 2' }, { id: 'data/class3.json', name: 'Class 3' }, { id: 'data/class4.json', name: 'Class 4' }, ], quizId: 'data/class1.json' }; pager = { index: 0, size: 1, count: 1 } componentDidMount() { console.log('componentDidMount'); this.load(this.state.quizId); } load(quizId, isValReload) { console.log('In load'); let url = quizId || this.props.quizId; if (isValReload) { let quiz = this.props.quizAll.find(a => url.indexOf(`${a.id}.`) !== -1); console.log('In load quiz : ', quiz); this.pager.count = quiz.questions.length / this.pager.size; this.props.onQuizLoad(quiz); this.props.onPagerUpdate(this.pager); }
如何在定時器倒計時到 0 時觸發事件
冉冉說
2023-03-10 13:53:00
