el componente principal obtiene el objeto del componente secundario a través de la función de devolución de llamada. Quiero verificar si el objeto con el ID de fila específico existe, si existe, entonces debería actualizar el objeto con el valor pasado "val", de lo contrario, debería agregar el objeto dentro de la matriz de estado. Mi respuesta se agrega correctamente, pero no puedo actualizar los valores, ayúdenme. el objeto que se está pasando se adjunta al final.
const [state, setState] = React.useState([]); const existingProduct = state && state.find((product) => product.rowID == index); if (!!existingProduct === false) { return setState((prevState) => [...prevState, object]); } console.log(state); let payload = { quantity: quantityRef.current && quantityRef.current.value, name: product && product.NAME, unit: product && product.UNIT, PRICE: product && product.PRICE, oldQuantity: oldQuantity, rowID: id, };Antes de responder, debo mencionar que !!existingProduct === false es muy confuso de leer. Simplemente puede hacer !existingProduct para lograr el mismo resultado.
A su código le faltan algunas partes, así que tendré que inferir, pero asumo que el valor del index hace lo que quiere, y ya está detectando si el producto está presente o no en la matriz. Y está agregando el nuevo producto en el if , entonces lo que necesitamos es un else .
Lo que haría sería copiar el estado en una nueva matriz, reemplazar el valor en la nueva matriz y establecer esta nueva matriz como el nuevo estado. Para saber qué posición de la matriz necesita actualizar, puede usar el método findIndex() en lugar de find() . Entonces, en lugar de que existingProduct sea un objeto, es el índice de la matriz que contiene ese objeto (así que lo llamaría Idx del Producto existingProductIdx solo para que quede claro):
if (existingProductIdx === -1) { // product doesn't exist in the array ... } else { // product exists const newSate = [...state] // creates a copy of the current array newState[existingProductIdx] = payload // set the position of the array to payload (or whatever should be the new value) return setState(newState) }Algunas notas:
return . De lo contrario no lo necesitassetState no tiene valor de retorno, por lo que en su lugar puede hacer setState(newState); return; . O bien, es posible que no necesite regresar en absoluto.state y setState a algo más significativo, como products y setProducts