js class in react code example

Example 1: class in react

class App extends Component {
    constructor() {
        super()
        this.state = {
            name: "Sally",
            age: 13
        }
    }
    
    render() {
        return (
            <div>
                <h1>{this.state.name}</h1>
                <h3>{this.state.age} years old</h3>
            </div>
        )    
    }
}

Example 2: functional components react

function Comment(props) {
  return (
    <div className="Comment">
      <div className="UserInfo">
        <img className="Avatar"
          src={props.author.avatarUrl}
          alt={props.author.name}
        />
        <div className="UserInfo-name">
          {props.author.name}
        </div>
      </div>
      <div className="Comment-text">
        {props.text}
      </div>
      <div className="Comment-date">
        {formatDate(props.date)}
      </div>
    </div>
  );
}

Example 3: how to use a js class in react

class Developer {  constructor(firstname, lastname) {    this.firstname = firstname;    this.lastname = lastname;  }   getName() {    return this.firstname + ' ' + this.lastname;  }} class ReactDeveloper extends Developer {  getJob() {    return 'React Developer';  }} var me = new ReactDeveloper('Robin', 'Wieruch'); console.log(me.getName());console.log(me.getJob());

Tags:

Misc Example