javascript - 如何在 React 中实现文本转语音

Question

我试图有一个简单的网页，一旦我将鼠标悬停在 div 标签上，它将开始阅读文本，如果我移开，它将暂停。问题是我不知道如何实现文本到语音的功能。我试过的那些没有用。

import React, {useRef} from "react";
import "./Subject1.css";

function Subject1() {
  const subject1_topic =  useRef(null)
  const speak = () => {
    
  }
  const dontspeak = () => {
    
  }
  return (
    <div className="subject1">
      <div className="subject1_title">Periodic Table:</div>
      <div className="subject1_topic" ref={subject1_topic} onMouseEnter={() => speak()} onMouseLeave={() => dontspeak()}>
        The periodic table, also known as the periodic table of elements, is a
        tabular display of the chemical elements, which are arranged by atomic
        number, electron configuration, and recurring chemical properties.
      </div>
    </div>
  );
}

export default Subject1;

所以基本上当我将鼠标悬停在 subject_topic div 上时，我需要它大声朗读。

标签： javascripthtmlreactjstext-to-speech