代码编织梦想

vue3的生命周期API

在这里插入图片描述

生命周期函数基本使用

1️⃣导入生命周期函数
2️⃣执行生命周期函数 传入回调

<scirpt setup>
import { onMounted } from 'vue'
onMounted(()=>{
  // 组件挂载完毕mounted执行了
})
</script>
执行多次

生命周期函数是可以执行多次的,多次执行时传入的回调会在时机成熟时依次执行

场景:比如维护之前的项目的时候,onMounted中写了好多逻辑,不好改,可以在写一个onMounted作为补充逻辑

<scirpt setup>
import { onMounted } from 'vue'
onMounted(()=>{
  // 自定义逻辑
  console.log(1)
})

onMounted(()=>{
  // 自定义逻辑
   console.log(2)
})
</script>
总结

1️⃣组合式API中生命周期函数的格式是什么?
On+生命周期名字

2️⃣组合式API中可以使用OnCreated吗?
没有这个钩子函数,直接写setUp中

3️⃣组合式API中组件卸载完毕时执行哪个函数?
onUnmounted

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_42268006/article/details/136020800

vue3.0组合式api生命周期函数和选项式api的区别_前端小白的成长日记的博客-爱代码爱编程

vue3.0生命周期函数 在vue3.0中有 选项式API 和 组合式API ,两者的生命周期函数有些许不同。 我们可以看到 setup函数(组合式api) 的生命周期里是没有beforeCreate 和 Create函数的, 因为 setup 是围绕 beforeCreate 和 created 生命周期钩子运行的,所以不需要显式地定义它们。换

vue3中选项式api和组合式api的生命周期-爱代码爱编程

文章仅供学习,如有任何问题欢迎指正。 在Vue3中,分别有着选项是Api和组合式Api,其生命周期也有着不同, 其中对于选项式Api基本与Vue2保持一致 beforeCreate:在实例被创建之前调用。created:在实例创建完成后立即调用。beforeMount:在挂载开始之前调用。mounted:在挂载完成后调用。beforeUp

使用vue调用colaai plus大模型,实现聊天(简陋版)-爱代码爱编程

首先去百度文心注册申请自己的api 官网地址:LuckyCola 注册点开个人中心 查看这个文档自己申请一个ColaAI Plus定制增强大模型API | LuckyColahttps://luckycola.com.cn/public/docs/shares/api/colaAi.html来到vue的页面 写个样式 <template

el-爱代码爱编程

 利用popper-class实现选项框内容过长,截取显示功能: <el-select popper-class="popper-class" :popper-append-to-body="false" v-model="value" placeholder="请选择"> <el-option v-for="ite

自定义el-爱代码爱编程

最终的效果 下拉选项的自定义内容好实现,因为他有默认插槽,所以直接在el-option标签里面写自定义内容就可以实现 <el-select ref="seriesBorderTypeRef" class="series-border-type" @change="changeSeriesBorder

前端vue架构-爱代码爱编程

1 理解: 创建视图的函数(render)和数据之间的关联; 当数据发生变化的时候,希望render重新执行; 监听数据的读取和修改; defineProperty:监听范围比较窄,只能通过属性描述符去监听已

vue.js的发展史(一)-爱代码爱编程

Vue.js的发展史(一) 什么是Vue? Vue (发音为 /vjuː/,类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建,并提供了一套声明式的、组件化的编程模型,帮助你高效地开发用户界面。无论是简单还是复杂的界面,Vue 都可以胜任。  来源官方解释--

vue3选项式和组合式生命周期说明-爱代码爱编程

生命周期:composition 生命周期先后顺序为: setup -beforeCreate和created的统称,只在composition里面取消这两个,可以在这里进行数据请求 onBeforeMount-挂载前,可以请求后台数据 onMounted-挂载,可以获取DOM实例 onBeforeUpdate-更新前,可以在此更改数据 onU

vue中的事件-爱代码爱编程

vue中的事件是什么 绑定事件用v-on,简写@v-on指令的参数是事件名(原生或者自定义),值是事件处理器有原生事件(click)和自定义事件(myEvent)在组件上使用原生事件,需要加native修饰符 自定义