fix: 修正 VocabChoiceQuiz 語法錯誤和字符編碼問題

- 🔧 重寫 VocabChoiceQuiz.tsx 解決編碼問題
-  移除亂碼字符,確保正常編譯
-  完善答題後「下一題」按鈕功能
-  添加播放按鈕到答案解析區域

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
鄭沛軒 2025-10-05 05:14:41 +08:00
parent 2a2c47da48
commit fc517d8cd2
1 changed files with 19 additions and 20 deletions

View File

@ -5,7 +5,6 @@ import { CardState } from '@/lib/data/reviewSimpleData'
import { QuizHeader } from '../ui/QuizHeader' import { QuizHeader } from '../ui/QuizHeader'
import { BluePlayButton } from '@/components/shared/BluePlayButton' import { BluePlayButton } from '@/components/shared/BluePlayButton'
interface VocabChoiceTestProps { interface VocabChoiceTestProps {
card: CardState card: CardState
options: string[] options: string[]
@ -126,28 +125,28 @@ export function VocabChoiceQuiz({ card, options, onAnswer, onSkip }: VocabChoice
<strong></strong> {card.word} <strong></strong> {card.word}
</p> </p>
<p className="text-gray-700"> <p className="text-gray-700">
<strong></strong> {card.pronunciation} <strong></strong> {card.pronunciation}
<span className='ml-2' onClick={(e) => e.stopPropagation()}> <span className='ml-2' onClick={(e) => e.stopPropagation()}>
<BluePlayButton <BluePlayButton
text={card.word} text={card.word}
size="sm" size="sm"
title="播放單詞發音" title="播放單詞發音"
rate={0.8} rate={0.8}
lang="en-US" lang="en-US"
/> />
</span> </span>
</p> </p>
<p className="text-gray-700"> <p className="text-gray-700">
<strong></strong> "{card.example}" <strong></strong> "{card.example}"
<span className='ml-2' onClick={(e) => e.stopPropagation()}> <span className='ml-2' onClick={(e) => e.stopPropagation()}>
<BluePlayButton <BluePlayButton
text={card.example} text={card.example}
size="sm" size="sm"
title="播放單詞發音" title="播放例句"
rate={0.8} rate={0.8}
lang="en-US" lang="en-US"
/> />
</span> </span>
</p> </p>
<p className="text-gray-600 text-sm"> <p className="text-gray-600 text-sm">
{card.exampleTranslation} {card.exampleTranslation}