Running Code on Mount

VueonMounted

<script setup lang="ts">
import { onMounted } from 'vue'

onMounted(() => {
  console.log('Component is ready')
})
</script>

<template>
  <p>Ready</p>
</template>

It registers onMounted to run the task after the component DOM has been inserted.

Vue docs

ReactuseEffect + []

import { useEffect } from 'react'

function Status() {
  useEffect(() => {
    console.log('Component is ready')
  }, [])

  return <p>Ready</p>
}

It uses useEffect with an empty dependency array to run the Effect after the first render.

React docs

AngularngAfterViewInit

import { Component } from '@angular/core'

@Component({
  selector: 'app-status',
  standalone: true,
  template: `<p>Ready</p>`,
})
export class StatusComponent {
  ngAfterViewInit() {
    console.log('Component is ready')
  }
}

It defines ngAfterViewInit to run the task after the component view and its children are initialized.

Angular docs