Tengo una matriz useState (lista de palabras) llamada lista. Hay 4 elementos en la lista y quiero actualizar el segundo elemento (por ejemplo) de esa lista. Estoy usando la función de mapa para mostrarlos. Aquí está el código (código de demostración) -
const word = ['a','b','c','d'] const [list, setList]=useState([]) for(let I=0; I<4;I++) {setList(<span className='black'>word[I])</span>} function colorChane(n){ How to change color of a word based on the number provided ??if I provide 2 then the word with the index 2 should change to color.className should change like className= 'red' How to update the className Of list item. } list.map(w => {w}) colorChange(2)Prueba esto
import { useState } from 'react' export default function App() { const words = ['Hi!', 'How', 'are', 'you'] const [selectedWordIndex, setSelectedWordIndex] = useState() return ( <div> <button onClick={() => { setSelectedWordIndex(2) }} > Change color of second word </button> {words.map((word, index) => { const isSelected = selectedWordIndex === index const className = isSelected ? 'red' : 'black' return ( <span key={word} className={className}> {word} </span> ) })} </div> ) }PD. si la respuesta fue útil, por favor den pulgar arriba :)