React Hook을 이용한 Functional Component 구현

React Hook을 이용한 Functional Component 구현

  // tsx
  import * as React from 'react'
  ...

  interface IProps {
    history?: History,
  }
  interface IStateProps {}
  interface IState {
    testVal: string,
  }

  type Props = IProps & IStateProps

  const Home: React.FC<Props> = ({ history }) => {
    const [state, setState] = React.useState<IState>({
      testVal: 'TEST',
    })

    const { testVal } = state

    // componentDidMount
    React.useEffect(() => {}

    // Test Function
    const handleButton = (clickText: string) => {
      setState({
        ...state,
        testVal: clickText
      })
    }

    ...

    return (
      <>
        <Button onClick={handleButton("Click")} />
        {testVal}
      </>
    )
  }

  export default ...