You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
46 lines
852 B
46 lines
852 B
<template>
|
|
<div class="person">
|
|
<h2>当前求和为：{{ sum }}</h2>
|
|
<button @click="changeSum">点我sum+1</button>
|
|
</div>
|
|
</template>
|
|
|
|
<!-- vue3写法 -->
|
|
<script lang="ts" setup name="Person">
|
|
import {
|
|
ref,
|
|
onBeforeMount,
|
|
onMounted,
|
|
onBeforeUpdate,
|
|
onUpdated,
|
|
onBeforeUnmount,
|
|
onUnmounted
|
|
} from 'vue'
|
|
|
|
// 数据
|
|
let sum = ref(0)
|
|
// 方法
|
|
function changeSum() {
|
|
sum.value += 1
|
|
}
|
|
console.log('setup')
|
|
// 生命周期钩子
|
|
onBeforeMount(()=>{
|
|
console.log('挂载之前')
|
|
})
|
|
onMounted(()=>{
|
|
console.log('挂载完毕')
|
|
})
|
|
onBeforeUpdate(()=>{
|
|
console.log('更新之前')
|
|
})
|
|
onUpdated(()=>{
|
|
console.log('更新完毕')
|
|
})
|
|
onBeforeUnmount(()=>{
|
|
console.log('卸载之前')
|
|
})
|
|
onUnmounted(()=>{
|
|
console.log('卸载完毕')
|
|
})
|
|
</script>
|