前言 要说今年最热门的前端技术，Vue3 和 TS 绝对榜上有名了。今天就给大家分享一下如何在 Vue3 组件中结合 Composition-Api 使用 TS 类型。如果有不会或者不熟的小伙伴，一起学起来吧！ 一、为 props 标注类型 使用 < script setup > 当使用 < script setup > 时，defineProps() 宏函数支持从它的参数中推导类型： 这被称为 运行时声明 ，因为……
Continue reading
前言 相信有很多人已经学习了 Vue3 的 API 和 新特性，但是令人头疼的是工作中依然使用的是 Vue2，也不知道自己的水平能否上手 Vue3 项目，今天把实践过程中常见使用场景分享给大家，希望对你们有所帮助。 场景一：父子组件数据传递 父组件数据传递到子组件 Vue3 中父组件同样是通过属性传递数据，但子组件接受数据的方……
Continue reading
前言 最近主管提出了许多优化用户体验的要求，其中很多涉及 dom 操作。本文将 Vue3 中常见的 dom 操作总结了一下。觉得文章不错、或对自己开发有所帮助，欢迎点赞收藏！ 一、通过 ref 拿到 dom 的引用 <template> <div class="ref-container"> <div ref="sectionRef" class="ref-section"></div> </div> </template> <script lang="ts" setup> import { ref } from 'vue' const sectionRef = ref() </script> 通过对 div 元素添加 ref 属性，为了获取到这个元素，我们声明了一个与 ref 属性名……
Continue reading
前言 本篇文章分享一下我在实际开发 Vue 项目时遇到的需要 —— 全局菜单搜索。全局菜单搜索本质是 router 的使用，该功能已经实现，接下来分享一下开发心得。 一、过滤路由 首先需要过滤出符合条件的路由信息，过滤的条件包含两个： 路由可以显示出现（hidden: false） 路由元信息中包含 title 属性 代码展示： /**……
Continue reading