App.vue
main.js
<template>
<h1>Lifecycle Hook 'beforeCreate' Example</h1>
<p>Using the beforeCreate lifecycle hook to create an alert, write to the console, and unsuccessfully trying to change the 'text' data property.</p>
<p>'{{ text }}'</p>
</template>
<script>
export default {
data() {
return {
text: 'initial text'
}
},
beforeCreate(){
console.log('beforeCreate lifecycle hook');
alert('beforeCreate lifecycle hook');
this.text = 'beforeCreate lifecycle hook'; // Does not work
}
}
</script>
import { createApp } from 'vue'
import App from './App.vue'
const app = createApp(App)
app.mount('#app')