Vue.js 3是一款開源的前端JavaScript框架，提供了豐富的API和組件來構建交互式的用戶界面。一個最重要的功能是鉤子函數。在Vue 3中，鉤子函數可以用來在組件的生命周期內注冊不同的回調函數，以對不同的狀態和事件進行響應。下面是Vue 3中鉤子函數的一些例子：

// 創建一個組件
const MyComponent = {
// 在組件加載前被調用
beforeCreate() {
console.log('beforeCreate called')
},
// 在組件加載完成后被調用
created() {
console.log('created called')
},
// 在組件準備好并且在DOM中被掛載前被調用
beforeMount() {
console.log('beforeMount called')
},
// 在組件被掛載到DOM中后被調用
mounted() {
console.log('mounted called')
},
// 在組件更新之前被調用
beforeUpdate() {
console.log('beforeUpdate called')
},
// 組件的狀態發生改變時被調用
updated() {
console.log('updated called')
},
// 在組件被卸載前被調用
beforeUnmount() {
console.log('beforeUnmount called')
},
// 在組件被銷毀后被調用
unmounted() {
console.log('unmounted called')
}
}

上面的代碼中展示了Vue 3中所有可用的鉤子函數。在使用過程中，我們可以選取需要使用的鉤子函數，添加對應的回調函數，來控制組件的生命周期。

除了以上展示的基本的鉤子函數之外，Vue 3還提供了一些自定義鉤子函數，如：setup和render等。setup函數是用來初始化組件中的變量和方法，render函數是用來渲染組件的DOM。下面是Vue 3中setup和render函數的例子：

// 創建一個組件
const MyComponent = {
// 在組件創建之前調用setup函數
setup() {
const state = reactive({
name: 'Vue.js 3',
version: 3.0
})
return {
state
}
},
// 在組件加載完成后調用render函數
render() {
return h('div', {}, [
h('h1', {}, this.state.name),
h('p', {}, `Version: ${this.state.version}`)
])
}
}

上面的代碼中，setup函數用來初始化組件中的變量和方法，通過reactive函數創建一個響應式的state對象。這里使用了模板函數h來生成DOM節點。

Vue 3的鉤子函數是非常重要的組件生命周期的一部分。通過使用不同的鉤子函數，我們可以控制組件的生命周期，實現更好的交互效果和用戶體驗。