Declaring function inside class component in React

Question

import React from 'react';

class App extends React.Component { 

  getTime() {
    return new Date().toLocaleDateString();
  }
  state = { time: null };

  render() {
    return (
    <div htmlFor="search">
      <label className="search" htmlFor="username">Name Please: </label>
      <input id="username" type="text" />
      <button style={{backgroundColor: 'blue', color: 'white'}}> Submit </button>
      <p>{getTime()}</p>
    </div>
  )
}
}

export default App;

I've been trying to get the time and display it in React but I keep getting errors. Line 16:11: 'getTime' is not defined no-undef But I've been doing just as tutorial told me to. What am I doing wrong?

this.getTime()?

jonrsharpe
– jonrsharpe

2021-04-12 09:40:54 +00:00
Commented Apr 12, 2021 at 9:40 — jonrsharpe
– jonrsharpe, Commented Apr 12, 2021 at 9:40

Sowam · Accepted Answer · 2021-04-12 09:50:29Z

2

first of all usually we define state in the beginning so just put it before getTime function
second thing - to be able to use functions in class components in react you have to add this before so just make it

<p>{this.getTime()}</p>

answered Apr 12, 2021 at 9:50

Sowam

1,7665 gold badges16 silver badges32 bronze badges

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

Comments

user9645391 · Accepted Answer · 2021-04-12 09:49:20Z

1

You should use this keyword for referring to the class and then methods and properties. So this.getTime(); should be used.

answered Apr 12, 2021 at 9:49

user9645391

Collectives™ on Stack Overflow

Declaring function inside class component in React

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related