Tengo un proveedor como este:
import {createContext, useContext, useState} from 'react' // Create Context object. const CartContext = createContext({ deliveryPersion:'own',//or other coupon:{}, updateCoupon: (obj) => {}, updateDeliveryPersion: (type) => {}, }) // Export Provider. export function CartProvider(props) { const updateCoupon = (_coupon) => { setState({...state,coupon: _coupon}) } const updateDeliveryPersion = (type) => { setState({...state,deliveryPersion: type}) } const initState = { deliveryPersion:'own', coupon:{}, updateCoupon:updateCoupon, updateDeliveryPersion:updateDeliveryPersion } const [state, setState] = useState(initState) return ( <CartContext.Provider value={state}> {props.children} </CartContext.Provider> ) } // Export useContext Hook. export function useCartContext() { return useContext(CartContext); } Mi senario: tengo dos componentes. component1 y component1 .
dentro component1 1, actualicé la variable deliveryPersion de esta manera:
... cartContext.updateDeliveryPersion('other') dentro component2 2 actualicé el objeto del coupon :
const data = {/**/} cartContext.updateCoupon(data) en este aquí deliveryPersion cambió al valor predeterminado (valor own ). en otras palabras, me falta el valor actual con el uso de la función de actualización.
donde esta mi problema
por ejemplo primer componente:
const cartContext = useCartContext() cartContext.updateDeliveryPersion(type)