javascript - TypeError: date.getHours is not a function? - Stack Overflow

admin管理员组

文章数量:1291839

I keep getting this error:

TypeError: date.getHours is not a function

when trying to use .getHours and I'm not sure why. This is the code I'm using:

import React from "react";
import "../Nav/Nav.css";
import Date from "./Date";

function NavBar() {
  var date = new Date();
  var hrs = date.getHours();
  var greeting;

  if (hrs < 12) greeting = "Good Morning";
  else if (hrs >= 12 && hrs <= 17) greeting = "Good Afternoon";
  else if (hrs >= 17 && hrs <= 24) greeting = "Good Evening";

  return (
    <div className="nav-container">
        <p className="greeting">{greeting}</p>
        <Date />
    </div>
  );
}

export default NavBar;

I keep getting this error:

TypeError: date.getHours is not a function

when trying to use .getHours and I'm not sure why. This is the code I'm using:

import React from "react";
import "../Nav/Nav.css";
import Date from "./Date";

function NavBar() {
  var date = new Date();
  var hrs = date.getHours();
  var greeting;

  if (hrs < 12) greeting = "Good Morning";
  else if (hrs >= 12 && hrs <= 17) greeting = "Good Afternoon";
  else if (hrs >= 17 && hrs <= 24) greeting = "Good Evening";

  return (
    <div className="nav-container">
        <p className="greeting">{greeting}</p>
        <Date />
    </div>
  );
}

export default NavBar;

• javascript
• typeerror

Share Improve this question Follow edited Jan 1, 2020 at 14:15 Nicholas Tower 85.2k1010 gold badges105105 silver badges119119 bronze badges asked Jan 1, 2020 at 13:38 Leslie TLeslie T 6311 gold badge11 silver badge44 bronze badges 10

• Hi Leslie, wele to SO, when I run this code it seems to work fine. Can you create a minimal reproducible example ? – Nick Parsons Commented Jan 1, 2020 at 13:41
• Maybe you are using an old browser? – Mikkel Commented Jan 1, 2020 at 13:59
• Hi Nick, thank you! I'm not really sure why because I was working a few days ago. – Leslie T Commented Jan 1, 2020 at 14:00
• Mikkel, I'm using chrome. I believe it's up to date but I'll double check – Leslie T Commented Jan 1, 2020 at 14:06
• In your latest code you show that Date is not the built in Date object, but some file you're importing. Can you show us that file? Alternatively, if you mean to use normal dates, delete that import. – Nicholas Tower Commented Jan 1, 2020 at 14:13

 |  Show 5 more ments

2 Answers 2

Sorted by: Reset to default 2

I just tried to recreate the issue. Copied the piece of code from your example and here is the result:

https://codepen.io/tural-ali/pen/vYEeaRK

var date = new Date();
var hrs = date.getHours();
alert(hrs);

It works totally fine.

That means it's something related to your imports:

import Date from "./Date";

is the line that causes the error. Try to create alias for this import as:

import Date as DateObject from "./Date";

you can not use Date as ponent and Date as Date object

please change

import Date from "./Date";
 ...
<Date />

to

import Date as ObjDate from "./Date";
 ...
<ObjDate />

本文标签： javascriptTypeError dategetHours is not a functionStack Overflow