Vue3学习记录(三)--- 组合式API之生命周期和模板引用

一、生命周期

1、简介

​ 生命周期,指的是一个 Vue 实例从创建到销毁的完整阶段,强调的是一个时间段。

​ 生命周期钩子函数,指的是 Vue 实例提供的内置函数,函数的参数为一个回调函数。这些钩子函数会在实例生命周期的某些固定时间点,依次按序执行其内部的回调函数。我们只需要在回调函数内部书写要执行的代码即可。

​ 在调用生命周期钩子函数时,Vue会自动将其回调函数注册到当前正在初始化 Vue 组件实例上,因此这些钩子函数应当在组件初始化时被同步注册,不可以在异步操作中调用这些钩子函数。因为当异步操作开始执行时,当前组件实例已经初始化完成,调用的钩子函数无法被注册到组件实例上。

​ 当然生命周期钩子函数也可以在一个外部函数中调用,只要调用栈是同步的,且最终起源自 <script setup> 就可以。

生周期图示:

在这里插入图片描述

2、生命周期钩子函数

​ 首先,在Vue3的组合式API中并不存在created()beforeCreate()这两个生命周期钩子函数,而是通过setup实现了更灵活的生命周期钩子函数,直接书写在<script setup>模块中的全局代码,相当于这两个钩子函数中的代码。

① onBeforeMount()
function onBeforeMount(callback: () => void): void

​ 该钩子函数会在组件实例被挂载到页面上之前被调用,此时组件中的响应式数据和函数方法等已经设置完成,可以在此阶段进行数据初始化计算操作。但此时组件中的DOM节点还没有被创建,此时无法操作DOM。

​ 该钩子函数在服务端渲染期间不会被调用,只会在客户端执行。

案例代码:

<template><div><h1>{{ text }}</h1></div>
</template><script setup>
// 引入要使用的模块 
import { ref, onBeforeMount } from 'vue'// 声明一个响应式变量
let text = ref('这是一个大标题')
// 声明一个函数
const changeTest = (value) => {text.value = value
}
// 使用onBeforeMount()钩子函数
onBeforeMount(() => {// 调用响应变量console.log(text.value); // 这是一个大标题// 调用函数changeTest('这是修改后的大标题')console.log(text.value); // 这是修改后的大标题// 尝试操作dom console.log(document.querySelector('h1')); // null 此时DOM还未渲染到页面上 无法被获取
})
</script>
② onMounted()
function onMounted(callback: () => void): void

​ 该生命周期钩子函数会在组件实例被挂载到页面上之后被调用,此时组件中的DOM结构和其同步子组件中的DOM结构都已经被挂载到页面上了,我们可以在此阶段进行 DOM 操作。

​ 该钩子函数在服务端渲染期间不会被调用,只会在客户端执行。

案例代码:

// 承接上个案例的代码... // 引入要使用的模块 
import { ref, onBeforeMount, onMounted } from 'vue'// 使用onMounted()钩子函数
onMounted(() => {// 调用响应变量console.log(text.value); // 这是修改后的大标题// 调用函数changeTest('这是再次修改后的大标题')console.log(text.value); // 这是再次修改后的大标题// 尝试操作dom console.log(document.querySelector('h1')); // 成功获取DOM <h1>这是再次修改后的大标题</h1>
})// 其他...
③ onBeforeUpdate()
function onBeforeUpdate(callback: () => void): void

​ 该钩子函数会在组件由于响应式状态变更,而引起的 DOM 树更新之前调用,此时获取DOM节点中的相关状态,还是未更新之前的状态;获取响应式状态,获取的是更新后的状态。我们可以在此阶段根据更新前后的数据状态进行相应操作。

​ 在onMounted()钩子函数中进行会引起DOM更新的响应式状态变更,也会触发当前钩子函数;在onBeforeMount()中的状态变更则不会,因为此时DOM结构还没有渲染到页面上。

​ 该钩子函数在服务端渲染期间不会被调用,只会在客户端执行。

案例代码:

<template><div><h1>{{ text }}</h1><button @click="changeTest('点击修改标题')">改变标题</button></div>
</template><script setup>
// 引入要使用的模块 
import { ref, onBeforeUpdate } from 'vue'// 声明一个响应式变量
let text = ref('这是一个大标题');// 声明一个函数
const changeTest = (value) => {text.value = value
}// 使用onBeforeUpdate()钩子函数
onBeforeUpdate(() => {// 输出变更后的响应式变量值console.log(text.value); // 点击修改标题// 获取 DOM 输出未更新的DOM状态值console.log(document.querySelector('h1').innerText) // 这是一个大标题
})
</script>
④ onUpdated()
function onUpdated(callback: () => void): void

​ 该钩子函数会在组件由于响应式状态变更,而引起的 DOM 树更新之后调用。此时获取DOM节点中的相关状态,获取的将是更新后的状态。这个钩子会在组件的 DOM 更新后被调用,这些更新可能是由不同的响应式状态变更引起的。

​ 不要在该阶段更改组件中的响应式状态,这肯有可能会导致无限死循环。

​ 该钩子函数在服务端渲染期间不会被调用,只会在客户端执行。

案例代码:

<template><div><h1>{{ text }}</h1><button @click="changeTest('点击修改标题')">改变标题</button></div>
</template><script setup>
// 引入要使用的模块 
import { ref, onUpdated } from 'vue'// 声明一个响应式变量
let text = ref('这是一个大标题');// 声明一个函数
const changeTest = (value) => {text.value = value
}// 使用onUpdated()钩子函数
onUpdated(() => {// 输出变更后的响应式变量值console.log(text.value); // 点击修改标题// 获取 DOM 输出更新后的DOM状态值console.log(document.querySelector('h1').innerText) // 点击修改标题
})
</script>
⑤ onBeforeUnmount()
function onBeforeUnmount(callback: () => void): void

​ 该钩子函数在组件实例被销毁之前调用,此时组件中的所有功能保持可用,可以在这一阶段做一些清理工作,例如取消订阅、清除定时器、释放资源等。

​ 该钩子函数在服务端渲染期间不会被调用,只会在客户端执行。

案例代码:

// 引入要使用的模块 
import { onBeforeUnmount } from 'vue'// 使用onBeforeUnmount()钩子函数
onBeforeUnmount(() => {// 做一些清理工作,释放占用的资源
})
⑥ onUnmounted()
function onUnmounted(callback: () => void): void

​ 该钩子函数在组件实例被销毁之后调用,此时当前组件的所有子组件都已经被卸载,且所有响应式状态(变量、计算属性、侦听器等)都停止作用了。这一阶段也可以做一些清理工作,例如取消订阅、清除定时器、释放资源等。但是尽量不要在该阶段进行一些耗时的操作,以免影响组件销毁的性能。

​ 该钩子函数在服务端渲染期间不会被调用,只会在客户端执行。

案例代码:

// 引入要使用的模块 
import { onUnmounted } from 'vue'// 使用onUnmounted()钩子函数
onUnmounted(() => {// 做一些清理工作,释放占用的资源
})
⑦ onActivated()
function onActivated(callback: () => void): void

​ 该钩子函数需要与<KeepAlive>结合使用,如果组件是<KeepAlive>中缓存组件的一部分,当组件被插入到DOM中时(包括首次挂载和从缓存重新挂载),会触发该钩子函数。

​ 该钩子函数在服务端渲染期间不会被调用,只会在客户端执行。

⑧ onDeactivated()
function onDeactivated(callback: () => void): void

​ 该钩子函数需要与<KeepAlive>结合使用,如果组件是<KeepAlive>中缓存组件的一部分,当组件从DOM中被移除时(包括进入缓存和组件卸载),会触发该钩子函数。

​ 该钩子函数在服务端渲染期间不会被调用,只会在客户端执行。

⑨ onErrorCaptured()
function onErrorCaptured(callback: ErrorCapturedHook): voidtype ErrorCapturedHook = (err: unknown,instance: ComponentPublicInstance | null,info: string
) => boolean | void

​ 该钩子函数会在捕获当前组件内的后代组件传递的错误时调用,错误源包括:组件渲染错误、事件处理器错误、侦听器错误等等。三个实参分别表示:错误对象、触发该错误的组件实例,以及一个说明错误来源类型的信息字符串。

​ 如果组件的继承链或组件链上存在多个 errorCaptured 钩子函数,对于同一个错误,这些钩子会被按从底至上的顺序,一一向上传递并调用errorCaptured 钩子函数。

​ 默认情况下,所有的错误都会被一层层向上传递,最终到达全局应用级的 app.config.errorHandler (前提是这个函数已经定义),如果我们在当前钩子函数中return false;,则会阻止错误向上传递,app.config.errorHandler 也无法监听到。

⑩ onRenderTracked()
function onRenderTracked(callback: DebuggerHook): voidtype DebuggerHook = (e: DebuggerEvent) => voidtype DebuggerEvent = {effect: ReactiveEffecttarget: objecttype: TrackOpTypes /* 'get' | 'has' | 'iterate' */key: any
}

​ 该钩子函数会在当前组件的组件模板渲染过程中追踪到响应式依赖时调用。且仅在开发模式下可用,在服务器端渲染期间不会被调用。

⑪ onRenderTriggered()
function onRenderTriggered(callback: DebuggerHook): voidtype DebuggerHook = (e: DebuggerEvent) => voidtype DebuggerEvent = {effect: ReactiveEffecttarget: objecttype: TriggerOpTypes /* 'set' | 'add' | 'delete' | 'clear' */key: anynewValue?: anyoldValue?: anyoldTarget?: Map<any, any> | Set<any>
}

​ 该钩子函数会在当前组件内响应式依赖发生变更并触发了组件渲染时调用。且仅在开发模式下可用,在服务器端渲染期间不会被调用。

⑫ onServerPrefetch()
function onServerPrefetch(callback: () => Promise<any>): void

​ 该钩子函数,只会在当前组件示例在服务器上被渲染之前调用。

3、父子组件的生命周期钩子函数执行顺序
组件挂载阶段:

​ 在父组件和子组件同事挂载到页面上时,会按照以下顺序执行挂载阶段的钩子函数:

  • 父组件的<script setup>(相当于created()beforeCreate())。
  • 父组件的onBeforeMount()钩子函数。
  • 子组件的<script setup>(相当于created()beforeCreate())。
  • 子组件的onBeforeMount()钩子函数。
  • 子组件的onMounted()钩子函数。
  • 父组件的onMounted()钩子函数。
组件更新阶段:

​ 只有当父子组件同时发生更新时,两者的更新阶段钩子函数才会都被触发。如果单独只在父组件内发生更新或只在子组件内发生更新,则只会触发相应组件内的更新钩子函数。

  • 父组件的onBeforeUpdate()钩子函数。
  • 子组件的onBeforeUpdate()钩子函数。
  • 父组件的onUpdated()钩子函数。
  • 子组件的onUpdated()钩子函数。
组件销毁阶段:

​ 当父组件被销毁时,其内部的子组件也会一并被销毁,并按照以下顺序执行销毁阶段的钩子函数。

  • 父组件的onBeforeUnmount()钩子函数。
  • 子组件的onBeforeUnmount()钩子函数。
  • 子组件的onUnmounted()钩子函数。
  • 父组件的onUnmounted()钩子函数。

二、模板引用

1、简介

​ 模板引用是Vue提供给我们用来操作DOM的一种方法,通过为DOM元素设置一个ref attribute属性,并设置属性值为一个响应式变量,从而获取对该DOM元素的引用。然后就可以对获取的DOM进行操作,例如:获取焦点、改变样式等等。

​ 模板引用可以获取对普通DOM元素的引用,也可以获取对组件实例的引用。但只有当目标DOM渲染到页面上后,才可以通过响应式变量来获取该DOM的引用,并对其进行操作。

2、普通DOM的引用

​ 想要获取一个普通DOM的引用,首先需要声明一个响应式变量,然后将该变量的名字设置为目标DOM的ref 属性的属性值即可,最终就可以通过响应式变量来访问对应的DOM。

案例代码:
<template><div><!-- 给DOM元素增加一个ref属性 属性值与响应式变量名相同 --><h1 ref="h1DOM">这是一个普通DOM</h1></div>
</template><script setup>
import { ref, onBeforeMount, onMounted, watchEffect } from 'vue';
// 声明一个响应式变量 变量名与模板中的ref属性值相同
const h1DOM = ref(null);watchEffect(() => {console.log('监听h1DOM属性值的变化----',h1DOM.value); // 初始为null 之后为对应DOM对象
})onBeforeMount(() => {// onBeforeMount阶段DOM还未挂载,所以获取不到DOMconsole.log('beforeMount中获取模板引用----',h1DOM.value); // null
})onMounted(() => {// onMounted阶段DOM已经挂载,可以获取到DOMconsole.log('onMounted中获取模板引用----',h1DOM.value); // 相应DOM
})
</script>
3、v-for列表渲染DOM的引用

v3.2.25 版本新增,可以通过模板引用,获取使用v-for进行列表渲染的DOM元素,获取结果为一个数组,包含列表渲染出来的所有元素,但是并不保证获取的元素数组的顺序与页面上元素的顺序相同。

​ 同样,首先需要声明一个响应式变量,然后将该变量的名字设置为目标DOM的ref 属性的属性值即可。

案例代码:
<template><div><!-- 给DOM元素增加一个ref属性 属性值与响应式变量名相同 --><div v-for="item in 5" ref="domList">{{ item }}</div></div>
</template><script setup>
import { ref, onMounted } from 'vue';
// 声明一个响应式变量 变量名与模板中的ref属性值相同
const domList = ref(null);onMounted(() => {// onMounted阶段DOM已经挂载,可以获取到DOMconsole.log('onMounted中获取模板引用----',domList.value); // 列表渲染的所有DOM// 遍历domList中的所有DOMdomList.value.forEach((item) => {console.log(item); // DOM})
})
</script>
4、模板引用函数

​ 除了给DOM的ref属性赋值一个响应式变量之外,还可以通过:动态给ref属性绑定一个函数,每次组件更新时,都会触发绑定的函数,绑定函数的第一个参数就是当前DOM的引用。

​ 当绑定元素被卸载时,ref绑定的函数也会被调用一次,不过此时表示DOM引用第一个参数值为null

案例代码:
<template><div><!-- 绑定函数 --><input :ref="(el) => console.log('这是绑定了匿名函数的ref',el)" /><input :ref="test" /></div>
</template><script setup>const test = (el) => {console.log('这是绑定js方法的ref----',el);
}
</script>
5、组件实例的引用

​ 当一个子组件加入的父组件中时,可以通过模板引用的方式,给其设置ref属性,从而获取到这个子组件的组件实例。

​ 如果这个子组件使用的是选项式API或者使用setup() 钩子函数的组合式API,则获取的组件实例与子组件的this完全相同,我们可以通过该组件实例访问子组件的每一个属性和方法,从而实现一些父子组件中的交互。当然这种方式并不推荐使用,因为可能会引起逻辑混乱,大多数情况下,还是推荐使用使用标准的 props 和 emit 接口来实现父子组件交互。

​ 但如果子组件使用的是<script setup>形式的组合式API,则该组件的属性和方法默认是私有的,默认情况下,获取的组件实例是无法访问组件中的任何属性和方法的。除非子组件通过defineExpose()宏方法(宏方法无需导入,可直接使用)主动向外暴露出一部分属性和方法,然后获取的组件实例才可以访问这些被主动暴露的属性和方法。

案例代码:

使用<script setup>形式的子组件Child.vue:

<template><div> <h3>这是一个子组件</h3></div>
</template><script setup>
import {  ref } from 'vue'
// 声明一个响应式变量
const son = ref('我是script setup中的一个变量')
const son2 = ref('我是script setup中的一个暴露出来的变量')// defineExpose 这样的编译器宏不需要导入
// 返回值会暴露给模板 能够被访问到
defineExpose({son2
})
</script>

使用setup() 钩子函数形式的子组件Child2.vue:

<template><div><h3>这是一个子组件</h3></div>
</template><script>
// 引入响应式API
import { ref } from 'vue'export default {// 使用setup()钩子函数setup() {// 声明响应式变量const son = ref('我是setup()钩子函数中的一个变量')// 返回值会暴露给模板和其他的选项式 API return {son}},
};
</script>

使用选项式API的子组件Child3.vue:

<template><div><h3>这是一个子组件</h3></div>
</template><script>
export default {name: 'ViteProjectChild',data() {return {son: '我是选项式API中的一个变量'};},
};
</script>

父组件:

<template><div><!-- 引入子组件 --><Child ref="son1"></Child><Child2 ref="son2"></Child2><Child3 ref="son3"></Child3></div>
</template><script setup>
import { ref, onMounted } from 'vue';
import Child from '../components/Child.vue';
import Child2 from '../components/Child2.vue';
import Child3 from '../components/Child3.vue';const son1 = ref(null);
const son2 = ref(null);
const son3 = ref(null);onMounted(() => {console.log('获取script setup的组合式API子组件----',son1.value); console.log('获取script setup的组合式API子组件的属性----',son1.value.son);console.log('获取script setup的组合式API子组件的属性2----',son1.value.son2);console.log('获取setup()钩子函数的组合式API子组件----',son2.value); console.log('获取setup()钩子函数的组合式API子组件的属性----',son2.value.son); console.log('获取选项式API的子组件----',son3.value); console.log('获取选项式API的子组件的属性----',son3.value.son);
})
</script>
页面效果:

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/721364.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

win系统如何同时安装MySQL5和MySQL8

win系统如何同时安装MySQL5和MySQL8 文章目录 win系统如何同时安装MySQL5和MySQL81、准备好两种版本的数据库2、下载后解压到你指定的目录3、手动配置安装MySQL5和8安装MySQL53.1创建my.ini文件3.2生成data文件夹 安装MySQL83.1创建my.ini文件3.2生成data文件夹 4、配置环境变量…

汽车车灯照明灯具维修的常见误区有哪些呢?

汽车车灯照明灯具维修的常见误区有哪些呢? 汽车灯具维修的常见误区包括以下几个方面&#xff1a; 忽视车灯的日常保养&#xff1a;许多车主在日常使用中忽视了车灯的保养&#xff0c;只有当车灯出现故障时才进行维修。然而&#xff0c;定期检查和保养车灯是预防故障发生的重要…

蓝牙耳机什么牌子好?五款优质蓝牙耳机无广推荐!

​许多人向我询问关于蓝牙耳机的推荐&#xff0c;以及如何选购蓝牙耳机&#xff0c;有哪些性价比高的蓝牙耳机等问题。我已经从网络上搜集并比较了几十款耳机&#xff0c;现在我将分享一些我认为不错的蓝牙耳机。无论是在音质还是配置方面&#xff0c;这些耳机都是非常不错的。…

关于vue创建项目以及关于eslint报错的问题

vue创建完项目以后如果报parsing error no babel config file。。。这样的错误的话&#xff0c;关闭项目&#xff0c;用vscode进入项目中打开项目就可以解决了。 1 代码保存的时候会自动将单引号报错为双引号 导致eslint报错的问题&#xff0c; 解决思路&#xff1a; 在项目根…

启英泰伦「离线自然说」:让照明语音交互更自然、更便捷

随着科技的不断发展&#xff0c;智能家居已经成为现代生活的一部分。其中&#xff0c;智能照明作为智能家居的重要组成部分&#xff0c;为人们带来了更加便捷、舒适的照明体验。然而&#xff0c;传统的离线语音交互技术在智能照明领域的应用一直受到词条存储量的限制&#xff0…

有个朋友被骗了,大家要擦亮眼睛

1.引言 大家好&#xff0c;我是Leo哥&#x1fae3;&#x1fae3;&#x1fae3;&#xff0c;昨天凌晨有个粉丝朋友找到Leo哥&#xff0c;咨询一些问题&#xff0c;现在的朋友们真卷呐&#xff0c;大半夜还在挑灯夜战。可无奈Leo哥12点之前已经睡了&#xff0c;身体为重&#xf…

智慧公厕:改变城市公共卫生管理的未来

现代城市发展快速&#xff0c;人口不断增加&#xff0c;公共卫生管理面临着严峻的挑战。传统公厕的建设、管理和使用模式已经无法满足日益提高的卫生与环保需求。然而&#xff0c;随着科技的进步与智能化的发展&#xff0c;智慧公厕正成为一种全新的解决方案&#xff0c;为城市…

数据库设计革命:逻辑模型的演变与面向对象的突破

✨✨ 欢迎大家来访Srlua的博文&#xff08;づ&#xffe3;3&#xffe3;&#xff09;づ╭❤&#xff5e;✨✨ &#x1f31f;&#x1f31f; 欢迎各位亲爱的读者&#xff0c;感谢你们抽出宝贵的时间来阅读我的文章。 我是Srlua&#xff0c;在这里我会分享我的知识和经验。&#x…

demo破坏升级

如果我们刚才所解释的dom破坏形式不再是单纯的x一层结构&#xff0c;而是x&#xff0c;y这种形式&#xff0c;两层结构&#xff0c;我们该怎么办 举个例子吧 我们的想法是先取x再取y&#xff0c;想法很简单&#xff0c;现实很苦感&#xff0c;看看结果吧 取出来的是undefined…

怎么采集GBK或GB2312等特殊字符编码的网站数据

如果要采集的网站是GBK或GB2312等特殊字符编码&#xff0c;采集结果可能是一堆看不懂的文字或乱码&#xff0c;无法使用。 通常网页文章采集工具有字符编码选项&#xff0c;默认是UTF-8&#xff08;现在大部分网站都是&#xff09;&#xff0c;改选为GBK或GB2312字符编码即可&…

[项目设计] 从零实现的高并发内存池(三)

&#x1f308; 博客个人主页&#xff1a;Chris在Coding &#x1f3a5; 本文所属专栏&#xff1a;[高并发内存池] ❤️ 前置学习专栏&#xff1a;[Linux学习] ⏰ 我们仍在旅途 ​ 目录 4.CentralCache实现 4.1 CentralCache整体架构 4.2 围绕Span的相关设计…

【深圳五兴科技】Java后端面经

本文目录 写在前面试题总览1、java集合2、创建线程的方式3、对spring的理解4、Spring Boot 和传统 Spring 框架的一些区别5、springboot如何解决循环依赖6、对mybatis的理解7、缓存三兄弟8、接口响应慢的处理思路9、http的状态码 写在前面 关于这个专栏&#xff1a; 本专栏记录…

【轮式平衡机器人】——TMS320F28069片内外设之Timer_IT(补:CCS程序烧录方法)

引入 Timer_IT 指的是 TMS320F28069 的定时器中断功能。在微控制器或数字信号控制器中&#xff0c;定时器是一个非常重要的外设&#xff0c;它可以用来产生固定时间间隔的中断&#xff0c;或者用来精确计算时间。 Timer_IT 的主要特点如下&#xff1a; 定时功能&#xff1a;…

React报错 之 Objects are not valid as a React child

原文链接&#xff1a; 1、React报错之Objects are not valid as a React child 2、Objects are not valid as a React child error [Solved] 作者&#xff1a;Borislav Hadzhiev 以下文中涉及到的链接均来自于该作者&#xff0c;他写了很多相关的文章&#xff0c;可以多看看他的…

综合素质保分卷一

10.根据《中华人民共和国预防未成年人犯罪法》的规定&#xff0c;强子多次实施了严重危害社会的行为后&#xff0c;经 由专门教育指导委员会评估同意&#xff0c;&#xff08; D&#xff09;会同公安机关可以决定将其送入专门学校接受专门教育。 A.父母或监护人 B.教师…

深度学习GPU环境安装(WINDOWS安装NVIDIA)

1.检测是否支持GPU环境 1.1.打开设备管理器 winows下面搜索设备管理器&#xff08;或者从桌面"此电脑"——>右键点击——>"管理"打开&#xff09; 1.2.查看本地显卡 在"设备管理器"——"显示适配器"中&#xff0c;如果没有&…

【Python】-----基础知识

注释 定义&#xff1a;让计算机跳过这个代码执行用三个单引号/双引号都表示注释信息&#xff0c;在Python中单引号与双引号没有区别&#xff0c;但必须是成对出现 输出与输入 程序是有开始&#xff0c;有结束的&#xff0c;程序运行规则&#xff1a;从上而下&#xff0c;由内…

低代码平台开发——基于React(文末送书)

目录 小程一言适用对象本书达成 书籍介绍作者简介内容介绍书籍目录阅读指导 小程送书 小程一言 《低代码平台开发——基于React》这本书主要围绕低代码平台和React技术的结合展开&#xff0c;为读者提供了关于低代码平台开发的理论和实践知识。 ## 书中内容简介 书中内容分为…

go-zero入门

本文简单介绍了go-zero&#xff0c;以及go-zero相关的安装配置。通过go-zero的hello world级别的一个的单体应用和一个包含两个服务的微服务应用&#xff0c;以实践的方式展示了go-zero项目的入门级搭建。 文章目录 1. 简介2. 快速开发单体应用3. 微服务应用搭建3.1 用户服务 u…

一本书讲透ChatGPT,实现从理论到实践的跨越!大模型技术工程师必读书籍【送书活动】

目录 前言一、内容简介二、作者简介三、专家推荐四、读者对象五、目录福利总结 前言 OpenAI 在 2022 年 11 月推出了人工智能聊天应用—ChatGPT。它具有广泛的应用场景&#xff0c;在多项专业和学术基准测试中表现出的智力水平&#xff0c;不仅接近甚至有时超越了人类的平均水平…