0
276
Visualizações¿Cómo agregar elementos a la lista de observación en reactJs?
Estoy tratando de averiguar cómo puedo agregar los artículos a la lista de seguimiento,
Los pasos que estoy tratando de llevar a cabo aquí son, cuando un usuario hace clic en el botón Agregar, los elementos deben agregarse a la página/componente de la lista de seguimiento que he creado.
Consulte la jerarquía del componente. Me gustaría mostrar los elementos agregados en la página de la lista de observación.
Por favor, vea el código que probé.
const [watchlist, setWatchlist] = useState ([]); const handleWatchlist = (movieData) => { const newList = [...watchlist, movieData] setWatchlist(newList) console.log(newList) } <Button className = {classes.cardButton}size = "small" onClick = { ()=> handleWatchlist(movie) }> Add </Button>Cuando trato de inspeccionar, el resultado es que muestra que los elementos se agregaron pero no se pueden pasar al componente de la lista de vigilancia. ¿Cómo se puede usar un accesorio para pasar este valor y mostrarlos?
Cualquier ayuda es muy apreciada.
Un millón de gracias
2 Respostas
Responde à pergunta0
El Button no pasa ningún argumento en handleWatchlist en su ejemplo. No sé cómo se ve el componente Button , pero pasar el argumento podría parecerse al siguiente ejemplo:
const Button = ({ onClick }) => { const value = "some value"; return <button onClick={() => onClick(value)}>Button</button>; }; const WatchList = () => { ... return <Button onClick={handleWatchlist}>Add</Button>0
Gracias por el apoyo, pero descubrí la solución usando dos enfoques y son
Que es la perforación de accesorios, es decir, es realizar la acción useState en mi App.js, que es mi página principal donde tengo el producto y el componente de lista de seguimiento.
Esta es la mejor manera que sugeriría que otras personas también usen usando contextAPI y useContext hooks . Una manera simple y fácil de pasar cualquier dato a cualquier parte de la aplicación.
Consulte el código completo con la solución de trabajo a continuación en codesandbox.
https://codesandbox.io/s/determinado-ruiseñor-m2mtn?file=/src/components/Productos
La aplicación de trabajo, donde puedo agregar los productos a la lista de observación.