[Solved]-React Axios fetch response with error Objects are not valid as a React child-Reactjs

React sees below object when it tries to render the result in state.

{
    result: {
        result: <your_data - res.data>
    }
}

Try

{loading ? <ReactBootStrap.Spinner animation='grow' /> : result}

instead of

{loading ? <ReactBootStrap.Spinner animation='grow' /> : { result }}

React cannot render object like { result }

And It will still fail since you wrap and save the result as an object.

Change

setResult({ result })

To

setResult(result)

This will still fail if res.data is not a type of string or array of JSX/string Elements.