React Context Erro r

JavaScript
1

Hi, I’m trying to update the context array. Here I’m creating the state (an array) in context and trying to update the context in other function. The context updates (but the type of the elements in the array are SyntheticBaseEvent) but I’m unable to pull out the values from the context.

Here is my code. Please have a look and help me

const testContext = React.createContext();


function Number(props){

    let [number, setNumber] = useState(1);
    const [numList, setNumList] = useContext(testContext);
    async function numberClick(number){
       await setNumber(prevNumber=>prevNumber+1);
       await setNumList(numList=>[...numList, number]);
       console.log(numList); // [syntheticBaseEvent, syntheticBaseEvent.....];
       props.console();
    }
    
    return(
        
        <div>
            {number}
            <button onClick = {numberClick}>clicktoadd</button>
        </div>
    )
}

function Fiction(){

    const[numList, setNumList] = useState([]);
    const[count, setCount] = useState(22);

    function consoling(){
        console.log(typeof(numList[0])); // When I'm console loggging type of any index in an array, it is returning me the syntheticBaseEvent instead of number
    }


    return(
        <>
        <testContext.Provider value = {[numList, setNumList]}>
            <Number console = {consoling}/> 
        </testContext.Provider>
        </>
    )
}

I’m unable to find whether there is any mistake in context or in the code itself. Please correct. Thanks in advance

2

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.