¿Es posible solo renderizar una función que este enlazada con el evento click?
Yo estoy intentando que el navegador hable con SpeechSynthesisUtterance()
: al principio hablaba y ahora ya no lo hace más, creo que tal vez sea porque tengo que renderizar el componente, y no estoy entendiendo muy bien cómo se renderizan los componentes y tampoco entiendo si puedo solo renderizar una función.
const MultipleChoice = props => {
const onClickSound = () =>{
let declaracion = new SpeechSynthesisUtterance("Chose");
declaracion.lang = 'en-US';
speechSynthesis.speak(declaracion);
}
return (
<div className="card text-center bg-dark text-whit">
<div className="card-header">
Days
</div>
<div className="card-body">
<h2 className="card-title m-4"><i className="bi bi-volume-up" onClick={onClickSound}></i> June</h2>
</div>
</div>
)
}
En este código lo que intento hacer es que la persona aprete en <i className="bi bi-volume-up" onClick={onClickSound}></i>
la cual estará llamando a la función onClickSound()
y este se encargará de hacer sonar el navegador, ahora: esta función ¿se puede renderizar?
De ser que yo este tipeando mal el código, igualmente quisiera saber si existe alguna forma de solo renderizar una función. Tal vez se pueda con ReactDOM.render
, pero solo quiero renderizar esa constante que está dentro del componente.