TypeError: Object(...) is not a function while using React Hooks

Question

So I am trying to implement routing in my Weather App project , What I am trying to achieve is that when I click on cityname , it should be displayed in another app. But somehow I get below error TypeError: Object(...) is not a function Below is my files :

My App.js

   const App = () => {
  return (
    <>
      <Container>
        <Switch>
          <Route exact path="/">
            <Header />
            <WeatherData />
          </Route>
          <Route exact path="/cities">
            <Header />
            <Cities />
          </Route>
          <Route path="/cities/:val" component={DataNaman}/>
        </Switch>
      </Container>
    </>
  );
};

My Next Component file when:

import React, { useParams } from "react";

const DataNaman = () => {
  debugger;
  let { val } = useParams();

  return (
    <>
      <h1>Naman</h1>
    </>
  );
};

export default DataNaman;

TheWuif · Accepted Answer · 2020-07-19 16:08:47Z

10

There is no useParams in the react library?

i expect you use react-router? then you should import the useParams from there.

import React from "react";
import { useParams } from "react-router-dom";

answered Jul 19, 2020 at 16:08

TheWuif

1,0469 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Naman Agarwal Over a year ago

Thanks buddy , I never gave it a look , I thought that it will automatically import it correctly

Collectives™ on Stack Overflow

TypeError: Object(...) is not a function while using React Hooks

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related