console
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=, initial-scale=">
<meta http-equiv="X-UA-Compatible" content="">
<title>Vue模板</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.2.36/vue.global.min.js"></script>
</head>
<body>
<div id="counter">
<span v-bind:title="message">Counter: {{counter}}</span>
</div>
<script>
const Counter = {
setup () {
console.log('setup');
onMounted (() => {
console.log('onMounted')
})
},
data () {
return {
counter: 10,
message: '这是一个计数器'
}
},
mounted () {
console.log('mounted')
setInterval(() => {
this.counter++
}, 1000)
}
}
Vue.createApp(Counter).mount('#counter')
</script>
</body>
</html>