React Context: TypeError: render is not a function

Question

I\'m trying to use React Context to pass a function to a nested child component, which effectively allows the child to update the parents state when pressed.

The pro

Answer 1

As the error states, should have the only child, and it should be a function. The error appears when it has multiple children, including text nodes.

; after embedded expression causes the problem. It's not a part of an expression, and making it a part of it would result in syntax error.

It should be:

    {({ handleChange }) => (
        
            
            { props.var_name }
            { props.price }
            { props.sku }
        
    )}