Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

372
Views
Javascript get Date format in H:M:S using react js

First I'll say that I've tried the solution in How do I use .toLocaleTimeString() without displaying seconds? and it didn't work for me.

I am trying to create a timer component with the h:m:s format but I always see the full current date. Does anyone have a solution? Here is my code:

import React , { Component } from 'react';

class Timer extends Component {
    constructor (props) {
        super(props);
        this.state = {
            count : 0
        }
    }

    render () {
        {
            var hour = Math.floor(this.state.count/3600),
            minutes = Math.floor((this.state.count - hour*3600)/60),
            seconds = (this.state.count - hour*3600 -minutes*60 ),
            date = new Date();
            date.setHours(hour, minutes, seconds);
        }
        
        return(
            <div>
                {date.toString( {hour: '2-digit', minute:'2-digit'})}
            </div>
        );
    }

}

export default Timer;

What I'm getting from this component looks like this:

enter image description here

Is it related to how react-js is working or am I writing the javascript code wrong?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

you can do it like this:

//your date
 let temp = new Date(); 
 let HMS = `${temp.getHours()}:${temp.getMinutes()}:${temp.getSeconds()}`

and now you have your hours:minutes:seconds

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!