Tengo un componente funcional al que se le han pasado datos ({haciendo clic}) desde su función principal, pero cuando trato de usarlo como una variable en mi función, se produce un error. Aquí está mi código actual:
function Songs({clicked}) { const songListFiltered = songList.filter(item => item.{clicked} === true) const songDisplayed = songListFiltered[Math.floor(Math.random() * songListFiltered.length)] return ( <div className="song-box"> <img src={songDisplayed.artwork} alt="album artwork" /> <h3>{songDisplayed.songName}</h3> <p>{songDisplayed.artistName}</p> </div> ) }Necesito verificar si songList tiene los datos en {clicked}, para filtrar esas canciones de la lista, pero no estoy seguro de cómo hacerlo funcionar. Me encantaría cualquier ayuda!
Dependiendo de la forma de sus datos, invocaría esto de diferentes maneras.
La variable {clicked} sería un objeto con pares de valores clave, por lo que debería usarla como clicked.yourCustomValue . Si es una matriz, usaría el índice, por lo que item.clicked[0] , y si clicked es una función, deberá invocarla con clicked() .
Basado en la declaración
Necesito verificar si songList tiene los datos en {clicked}
Y basado en el código
listacanciones.filtro(elemento => elemento.{clic} === verdadero)
Supongo que la variable {clicked} sería una matriz que contiene una colección de objetos de canciones que el usuario ha seleccionado, y el tipo de datos de la variable songList es una matriz que contiene objetos de canciones
Entonces, puede reemplazar la variable songListFiltered con
const songListFiltered = songList.filter(function (e) { let result = []; for (let songClicked of clicked) { if (e.songName === songClicked.songName) { result.push(e); } } return result.length === 0 ? null : result; }); O si quiere decir que {clicked} es una propiedad que agrega a cada uno de los objetos songList cuando ha seleccionado una canción, entonces puede usar typeof cuando verifique el filtro de condición. Entonces, el código podría ser el siguiente songList.filter(item => typeof(item.clicked) !== "undefined")
Elemento de filtrado de matriz La matriz contiene verificación