亦世凡华、
个人:csdn内容合伙人、阿里云专家博主、51CTO博主;目标:深耕技术,追求代码之美,享受编程人生;当下:珍惜时间,奋发学习;未来:渴望成为一名真正的全栈大佬,并为此一直努力,矢志不渝!
展开
-
Vue--》从零开始打造交互体验一流的电商平台(一)
今天开始使用搭建一个电商项目平台,因为文章会将项目的每处代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2024-05-06 11:46:26 · 186 阅读 · 3 评论 -
【VueUse】超越基本功能的高级 Vue 元素操作
监测和响应用户与页面的交互,自动聚焦输入框或执行验证操作。:管理页面的可见性状态,优化用户体验和应用程序性能。:实现元素的拖拽功能,从而增强了应用程序的交互性和可用性。:在 Vue 应用中实现拖放区域,从而提升应用的交互性和用户体验。:获取和管理元素的边界信息,处理元素相关的操作和交互。:响应式的方式获取和管理元素的尺寸信息,处理元素相关的操作和交互。:监测元素大小的变化,并实时响应变化。:监测和响应元素的可见性变化,实现与可见性相关的功能和优化。:实现在元素可见状态变化时自动更新相关的界面内容或状态。原创 2024-04-30 17:23:41 · 341 阅读 · 11 评论 -
【VueUse】重新定义状态管理在 Vue 中的体验
本文中我们将深入探讨 VueUse 中与状态管理相关的内容,从基本的状态响应式到高级的状态管理技巧,以及一些实用的状态管理模式。无论你是刚刚接触 Vue 还是已经是一名经验丰富的 Vue 开发者,本文都将为你带来新的见解和灵感,让你在状态管理的道路上走得更远、更高。原创 2024-04-24 23:38:48 · 292 阅读 · 19 评论 -
Vue--》深入了解 VueUse 功能性工具集
VueUse 是一个专门为 Vue.js 生态系统设计的功能性工具集合。它提供了许多可重用的功能函数,可以帮助开发者更轻松地构建 Vue.js 应用程序。VueUse 提供了大量的功能,包括状态管理、副作用管理、组合式 API、浏览器 API 封装等等。原创 2024-04-23 22:10:22 · 285 阅读 · 8 评论 -
Vue--》打造简易3D化商城平台项目实战
今天开始使用搭建一个简易3D化商城平台项目,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会用文章进行讲解,我会在文章的最后将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2024-03-31 23:21:43 · 174 阅读 · 17 评论 -
Vue--》打造简易直播应用平台项目实战
今天开始使用搭建一个简易直播应用平台项目,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2024-03-03 18:10:41 · 367 阅读 · 10 评论 -
Vue--》深入学习Tailwind CSS掌握优雅而高效的前端样式开发
Tailwind CSS是一种基于原子设计理念的现代CSS框架。它通过提供大量可复用的独立类来构建界面,而不是依赖于预定义的组件。与传统的CSS框架不同,Tailwind CSS不提供封装好的样式组件,而是专注于提供低级的原子类,使开发者能够自由组合和定制样式。原创 2024-02-13 23:50:29 · 1406 阅读 · 19 评论 -
Vue--》简易资金管理系统后台项目实战(前端)
今天开始使用 vue3 + ts + node 搭建一个简易资金管理系统的前后端分离项目,因为前后端分离所以会分两个专栏分别讲解前端与后端的实现,后端项目文章讲解可参考:后端链接,我会在前后端的两类专栏的最后一篇文章中会将项目代码开源到我的GithHub上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识。原创 2023-10-28 20:33:38 · 1146 阅读 · 27 评论 -
Vue实现手机端界面的购物车案例
今天用Vue实现的一个手机端的购物车案例,着重阐述组件化思想的优势,将页面的内容分成各个模块进行书写,然后数据传输,父传子、子传父、兄弟数据共享等,这方面知识不牢固的话可以关注一下右方vue的专栏:Vue专栏 里面详解介绍了vue的知识,今天的案例也是借助黑马的相关案例及其接口,既是分享也是回顾。因为本案例是借助vue的框架进行实现的,所以我们需要先搭建vue-cli脚手架,具体的搭建过程请看右方链接 vue-cli脚手架的搭建与使用 ,搭建完成后,需要根据案例的具体的图片功能点要求给components原创 2022-12-04 13:06:04 · 2937 阅读 · 30 评论 -
Vue实现后台管理系统
Vue路由这篇文章详细介绍了路由的知识;Vue导航这篇文章详细介绍了路由导航的知识。原创 2022-12-18 21:25:42 · 5848 阅读 · 25 评论 -
Vue--》打造个性化医疗服务的医院预约系统(七)完结篇
今天开始使用搭建一个医院预约系统的前台页面,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-08-20 23:34:17 · 646 阅读 · 31 评论 -
Vue--》打造个性化医疗服务的医院预约系统(六)
今天开始使用搭建一个医院预约系统的前台页面,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-08-18 22:37:39 · 390 阅读 · 21 评论 -
Vue--》打造个性化医疗服务的医院预约系统(五)
今天开始使用搭建一个医院预约系统的前台页面,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-08-10 22:33:41 · 466 阅读 · 21 评论 -
Vue--》打造个性化医疗服务的医院预约系统(四)
今天开始使用搭建一个医院预约系统的前台页面,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-07-27 23:14:27 · 974 阅读 · 27 评论 -
Vue--》打造个性化医疗服务的医院预约系统(三)
今天开始使用搭建一个医院预约系统的前台页面,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-07-23 14:55:49 · 537 阅读 · 33 评论 -
Vue--》打造个性化医疗服务的医院预约系统(二)
今天开始使用搭建一个医院预约系统的前台页面,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-07-20 21:10:32 · 531 阅读 · 32 评论 -
Vue--》打造个性化医疗服务的医院预约系统(一)
今天开始使用搭建一个医院预约系统的前台页面,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-07-14 21:34:24 · 1030 阅读 · 19 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(十二)完结篇
今天开始使用搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-07-09 19:34:32 · 579 阅读 · 30 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(十一)
今天开始使用ts搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-07-09 16:26:46 · 350 阅读 · 13 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(十)
今天开始使用搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-07-08 17:27:02 · 406 阅读 · 26 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(九)
今天开始使用vue3搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-07-05 22:48:27 · 532 阅读 · 27 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(八)
今天开始使用搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-06-29 23:07:01 · 458 阅读 · 31 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(七)
今天开始使用搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-06-24 13:12:47 · 946 阅读 · 30 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(六)
今天开始使用搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-06-22 00:09:21 · 891 阅读 · 29 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(五)
今天开始使用 vue3 + ts 搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的GithHub上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识。原创 2023-06-15 02:50:20 · 654 阅读 · 33 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(四)
今天开始使用搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-06-04 18:46:43 · 1171 阅读 · 44 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(三)
今天开始使用 vue3 + ts 搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的GithHub上,大家可以自行去进行下载运行。原创 2023-05-31 17:16:17 · 1095 阅读 · 28 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(二)
今天开始使用 vue3 + ts 搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的GithHub上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(阅读本文章能够学习到的技术):当然还有许多其他的需要安装的第三方库,这里就不再一一介绍了,在项目中用到的地方自行会进行讲解,大家自行学习即可,现在就让我们走原创 2023-05-29 23:35:27 · 1029 阅读 · 26 评论 -
Vue--》Vue3打造可扩展的项目管理系统后台的完整指南(一)
今天开始使用搭建一个项目管理的后台,因为文章会将项目的每一个地方代码的书写都会讲解到,所以本项目会分成好几篇文章进行讲解,我会在最后一篇文章中会将项目代码开源到我的上,大家可以自行去进行下载运行,希望本文章对有帮助的朋友们能多多关注本专栏,学习更多前端vue知识,然后开篇先简单介绍一下本项目用到的技术栈都有哪几个方面(:快速轻量且功能丰富的前端构建工具,帮助开发人员更高效构建现代Web应用程序。:高性能、轻量级npm替代品,帮助开发人员更加高效地处理应用程序的依赖关系。原创 2023-05-23 15:57:02 · 1681 阅读 · 41 评论 -
Vue--》深入理解 Vue 3 导航守卫,掌握前端路由的灵魂技能!
是Vue Router中的导航守卫之一,它用于在路由切换之前执行一些逻辑操作,例如检查用户是否登录或者获取一些路由需要的数据。:路由元信息指的是在 Vue Router 中,可以在路由配置中添加一些自定义信息,这些信息可以在路由组件中使用。接下来可以在入口文件 main.ts 处设置前置守卫的代码了,根据如下代码的效果就可以实现在未登录的情况下是不能直接访问我们后台 index 路径下的路由的,登录之后会存放一个token,有token之后就可以直接访问后台 index 页面的内容了。原创 2023-05-21 00:06:26 · 1091 阅读 · 25 评论 -
Vue--》Vue 3 路由进阶——从基础到高级的完整指南
安装完成之后,一般我们都会在src目录下新建一个router文件夹,里面存放着路由文件,这里注册组件我采用的是路由懒加载方式,只有在需要时才动态加载相应的代码,从而提高应用程序的性能和加载速度。这种方式下,在路由被访问时,对应的组件才会被加载。这个“空路径”路由没有对应的组件渲染,只起到一个容器的作用,它的下级路由的路径是基于该路由的路径计算的。Vue3路由的基本操作就讲解到这,下一篇文章会继续讲解vue3导航守卫的相关内容,喜欢的朋友可以点击关注一键三联,您的支持就是博主创作的最大动力!原创 2023-05-18 21:16:03 · 1093 阅读 · 27 评论 -
Vue--》探索Pinia:Vue状态管理的未来
但是,Pinia 可以与其他框架和库一起使用,例如在通过 Vue.js 构建的应用程序中,如果需要在 React 组件中使用 Pinia 中的状态,可以使用 Vue.js 手动渲染 React 组件的方法来实现。在 Vuex 中有一个全局的 store(仓库),用于存储应用程序中的所有状态,而 Pinia 中则是一个基于类的 API,每个组件实例均有自己的 Pinia store,这使得应用程序的状态管理更加灵活、容易。而 Vuex 的 API 更加灵活,但也更为复杂,需要花费更多的时间学习。原创 2023-05-17 17:55:42 · 2783 阅读 · 29 评论 -
Vue--》如何在Vue3中书写TSX
在vue2的时候就已经可以使用 jsx 语法,但是不是很友好,写起来是一件很痛苦的事情,所以你很少见到有人会在vue2中书写 jsx 语法,官方也不建议我们在vue2中进行书写 jsx 的代码风格:但随着vue3版本的到来,对typescript的支持度越来越高,tsx语法也被大部分人越来越接收,所以很多项目都是搭配 Vue3 + TS 进行的,所以在vue3项目中懂得如何书写 tsx 风格的代码,对于代码扩展学习还是有必要的。原创 2023-05-12 20:33:59 · 1853 阅读 · 20 评论 -
Vue--》基于Vue的UI组件库,大家应该熟悉并会使用
虽然组件库的使用极大的减轻了程序员书写样式的麻烦,但并不意味着我们就一直需要依赖组件库而抛弃了传统的自己书写样式的方式。组件库是具有自己的独特的特点风格的,就类似于NutUI一样,大家都会用组件库,而都用组件库就会导致大家的界面风格都一致,没有任何的创新和DIY是不好的,当然组件库也是有益处的,看项目具体情况使用,我想是最好的。原创 2023-01-13 16:16:40 · 821 阅读 · 20 评论 -
Vue--》Vue3的setup语法糖到底香不香?你来看看就知道了
总体来说,setup语法糖还是提供了比较便捷的书写规范,简省了以前许多比较冗余的代码,还是比较香的哈,而setup语法糖我也是看着官方给出的文档来学习的,也是将自己的一些学习上感悟分享给大家,如果大家觉得还是有收获的话,希望给个一键三连吧,您的支持就是博主创作的最大动力!原创 2023-01-12 20:09:03 · 984 阅读 · 23 评论 -
Vue--》详解状态管理工具——Vuex
我们将vuex进行模块化分组,那么调用这个共享的数据的方法肯定不能和之前的一样了,要进行一定的变化,不知道有没有发现,我们在进行模块化分组的时候是需要使用命名空间 namespace 的配置项,这种重点!,其工作原理图如下图所示:Vuex中的三个函数都是在同一个仓库store里面的,actions一般用于发送Ajax请求,当然日常开发中,如果没有特别的要求,actions也可以省略而让数据去直接访问mutations也是可以的。我们点击按钮,Vuex会监听到你当前执行的函数以及数据发生的时间及其变化。原创 2023-01-10 20:49:49 · 844 阅读 · 18 评论 -
Vue--》实现动画与过渡效果
Vue封装的过渡与动画作用是在插入、更新或移除DOM元素时,在合适的时候给元素添加类名。原创 2023-01-09 13:39:09 · 609 阅读 · 21 评论 -
Vue--》Vue3自定义组件以及新组件的使用讲解
在Vue3中不止语法进行了一定的修缮,而且出现了一些,Vue不存通过自定义ref,可以很方便的对其中的某些具体实现流程进行一定控制,实现一些特殊的效果。还有一些组合式API就不再提及,需求者可自行去官网查看。在Vue3中不止语法进行了一定的修缮,而且出现了一些,Vue不存在的新的组件,举几个常年的组件进行讲解,如下:在Vue2中,组件必须有一个根组件,而在Vue3中组件可以没有根组件,内部会将多个标签包含在一个Fragment虚拟元素中。减少了标签层级,减少了内存使用。Teleport是一种能够将我们原创 2023-01-07 21:40:29 · 2527 阅读 · 17 评论 -
Vue--》Vue3给数据共享增添的改变
目录数据共享父向子共享数据子向父共享数据父子组件间数据双向同步兄弟组件共享数据后代组件共享数据使用Vue3的setup函数实现后代数据共享在项目开发中,组件之间的关系分为如下3种:父子关系、兄弟关系、后代关系。父组件通过 v-bind 属性绑定向子组件共享数据。同时子组件需要使用props接收数据。如下:子组件通过自定义事件的方式向父组件共享数据,Vue3新增了一个声明自定义事件的容器:emits父组件在使用子组件期间,可以使用 v-model 指令维护组件内外数据的双向同步:兄弟组件之间实现数据共享的方案原创 2023-01-07 14:38:37 · 602 阅读 · 13 评论 -
Vue--》Vue3生命周期以及其它组合API的讲解
hook本质上是一个函数,把setup函数中使用的Composition API进行了封装,类似 Vue2.x 中的mixin,其优势在于:复用代码,让setup中的逻辑更加清楚易懂。我们在外部声明了一个js函数方法,只要程序员有需要,就只要引入该文件,使用该方法即可。// 数据x:0,y:0})// 坐标方法})})// 将得到的数据给返回出去当前点击时鼠标的坐标为:x:{{point.x}},y:{{ point.y }}原创 2023-01-06 17:55:18 · 573 阅读 · 14 评论