0
0 Comments

I just want to get input as prompt at the beginning of the web page from user about its name and show it on the screen. I create let variable on ‘componentDidMount’ but it asks again and again infinitely. I can’t create to other parts and it says ‘fullname’ is undefined. What is the proper way of doing it?

import './App.css';
import React, { Component } from 'react';
import Clock from './Clock';


class App extends Component {

  state = {
    secondRatio: 0,
    minuteRatio: 0,
    hourRatio: 0
  }

  getName() {
    let fullname = prompt("Lutfen isim giriniz:");
    return fullname;
  }

  componentDidMount() {
    setInterval(() => (
      this.setClock()
    ), 1000);
    console.log(this.fullname);
  }

  setClock = () => {
    const currentDate = new Date;
    let secondRatio = currentDate.getSeconds() / 60;
    let minuteRatio = (secondRatio + currentDate.getMinutes()) / 60;
    let hourRatio = (minuteRatio + currentDate.getHours()) / 12;
    this.setState({ secondRatio: secondRatio });
    this.setState({ minuteRatio: minuteRatio });
    this.setState({ hourRatio: hourRatio });
  }

  render() {

    const { secondRatio, minuteRatio, hourRatio } = this.state;

    return (
      <fragment>
        <div>  <h1 className="text1">Hello, {this.getName().fullname} ! Welcome! </h1>
          <div className="test"><Clock secondRatio={secondRatio} minuteRatio={minuteRatio} hourRatio={hourRatio} />
          </div>
        </div>
      </fragment>
    );
  }
}

export default App;
Anonymous Asked question May 14, 2021