dramaling-vocab-learning/note/learn-backup/learn-backup/learn/tests/SentenceFillTest.tsx

36 lines
1022 B
TypeScript

interface SentenceFillTestProps {
currentCard: any
fillAnswer: string
showHint: boolean
showResult: boolean
onAnswerChange: (answer: string) => void
onSubmit: () => void
onToggleHint: () => void
onReportError: () => void
onNavigate: (direction: string) => void
currentCardIndex: number
totalCards: number
setModalImage: (image: string | null) => void
}
export const SentenceFillTest: React.FC<SentenceFillTestProps> = (props) => {
return (
<div className="text-center py-8">
<p>SentenceFillTest </p>
<p>: {props.currentCard?.word}</p>
<input
type="text"
value={props.fillAnswer}
onChange={(e) => props.onAnswerChange(e.target.value)}
className="border px-3 py-2 rounded mx-2"
placeholder="輸入答案"
/>
<button
onClick={props.onSubmit}
className="bg-blue-500 text-white px-4 py-2 rounded ml-2"
>
</button>
</div>
)
}