What is wrong with this code?

Question

React Native

import Checkbox from 'expo-checkbox';
import React, { useState } from 'react';
import { StyleSheet, Text, View, Alert, Modal,  Pressable, TextInput, Switch } from 'react-native';

export default function App() {
  
   this.state = {
    counter: 0,
    title: 'setState tutorial',
  };

  
this.clickHandler = () => {
    this.setState({ counter: Math.random() });
  };
  return (

    
  <>

     <h1>{this.state.title}</h1>
        <div>{this.state.counter}</div>
        <button onClick={this.clickHandler}>Click!</button>
   
   </>


  );
}



const styles = StyleSheet.create({
  container: {
    flex: 1,
    marginHorizontal: 16,
    marginVertical: 32,
  },
  section: {
    flexDirection: 'row',
    alignItems: 'center',
  },
  paragraph: {
    fontSize: 15,
  },
  checkbox: {
    margin: 8,
  },
});

Answer 1

Is it because the functional component does not have this.setState?