haldarmahesh

import React, { useState } from 'react';
export default function counterHook() {
  const [count, setCount] = useState(0);
  return (
    <div>
      <div>
        <button onClick={() => setCount(count + 1)}> + Increment</button>
        <button onClick={() => setCount(count - 1)}> - Decrement</button>
      </div>
      <div>

haldarmahesh

import React, { Component } from 'react'

export default class Counter extends Component {
  constructor(props) {
    super(props);
    this.state = {
      counter: 0
    }
    this.handleCounter = this.handleCounter.bind(this);
  }

haldarmahesh

render() {
    return (
      <div>
        <Brick/> <Brick/> <Brick/> <Brick/> <Brick/> <Brick/> <Brick/> <Brick/>
        <Brick/> <Brick/> <Brick/> <Brick/>
      </div>
    )
  }

haldarmahesh

componentWillUnmount() {
  this.chart.destroy();
  this.resetLocalStorage();
  this.clearSession();
}

haldarmahesh

type Snapshot = number | null;

class ScrollingList extends React.Component<Props, State, Snapshot> {
  listRef = React.createRef();

  getSnapshotBeforeUpdate(
    prevProps: Props,
    prevState: State
  ): Snapshot {
    // Are we adding new items to the list?

haldarmahesh

shouldComponentUpdate(nextProps, nextState) {
  let shouldUpdate = this.props.status !== nextProps.status;
  return shouldUpdate;
}

haldarmahesh

componentDidMount() {
 if (this.props.modules) {
            this.props.modules.forEach(function (module) {
                module(Highcharts);
            });
        }
        // Set container which the chart should render to.
        this.chart = new Highcharts[this.props.type || "Chart"](
            this.props.container, 
            this.props.options

haldarmahesh

render() {
  <div>
     <PlayHeader>
       <Status/>
       <VolumeBar/>
       <SeekBar/>
    </PlayHeader>
   </div>
}

haldarmahesh

static getDerivedStateFromProps(props, state) {
  if (state.value !== props.value) {
      return {
        derivedValue: deriveValueFromProps(props),
        mirroredProp: props.value
      }
     }
  // when null is returned no update is made to the state
  return null;
}

haldarmahesh

class ContraMusicPlayer extends React.Component
constructor(props) {
  super(props);
  this.state = {
    volume: 70,
    status: 'pause'
  }
}