Uncaught (in promise) TypeError: (intermediate value).toLocalDateString is not a function at Stats.js:62

Viewed 228
function Stats() {
  const [customerList, setCustomerList] = useState([]); //store all that information of the database in a list
  //make an axios request to get information from database
  const getCustomers = () => {
    Axios.get("http://localhost:3001/customers").then((response) => {
      //console.log("successfully retrieved customers list from database");
      console.log(response.data);
      setCustomerList(response.data);
    });
  };

  {/*}
    const [currentTime, setCurrentTime] = useState(1);
  
    useEffect(() => {
      fetch("/time")
        .then((res) => res.json())
        .then((data) => {
          setCurrentTime(data.time);
        });
    }, []);
  

    useEffect(() => {
      fetch("/time")
        .then((res) => res.json())
        .then((data) => {
          const dateStr = new Date(data.time).toLocalDateString('en-CA');
          const timeStr = new Date(data.time).toLocalTimeString();
          const dateTime = `${dateStr} ${timeStr}`;
          setCurrentTime(dateTime);
        });
    }, []);
    */}
    
  return (
    <div>
      <Navbar />
      <div className="container">
      <h1>Dashboard</h1>
      <button onClick={getCustomers}>Show Dashboard</button>
      </div>
      <table className="customertable">
        <thead>
        <tr>
          <th>S/N</th>
          <th>Customer Name</th>
          <th>Customer Email</th>
          <th>Counts of Visit</th>
          <th>Latest Time of Visit</th>
          <th>Contacted?</th>
        </tr>
        </thead>
        <tbody>
        {customerList.map((val, key) => {
          const dateStr = new Date(val.latest_time_of_visit).toLocalDateString('en-CA');
          const timeStr = new Date(val.latest_time_of_visit).toLocalTimeString();
          const dateTime = `${dateStr} ${timeStr}`;
          return (
            <tr>
              <td>{val.ID}</td>
              <td>{val.name}</td>
              <td>{val.email}</td>
              <td>{val.counts_of_visit}</td>
              <td>{dateTime}</td>
              <td>{val.contacted}</td>
            </tr>
          );
        },)}
        </tbody>
      </table>
    </div>
  );
}

export default Stats;

here is the code I used the error happens at: This error happens when I click on "Show Dashboard" button which calls a getCustomer function on click, does anyone have any solution to this error? when I click the button. I left out the import statements, but in case you need them let me know or comment! Appreciate your help!

const dateStr = new Date(val.latest_time_of_visit).toLocalDateString('en-CA');
1 Answers

toLocalDateString --> toLocaleDateString

toLocalTimeString --> toLocaleTimeString

Related