vue3.0
文章平均质量分 63
vue3.0
绝对零度HCL
天道酬勤
展开
-
Vue面试题18问
前端面试 vue面试试题,前端面试题锦集原创 2023-05-22 16:08:09 · 1257 阅读 · 0 评论 -
vue核心原理之--理解Tree-Shaking
这个概念在前端领域是因为rollup.js而起,后来webpack等也加入支持的行列中。简单来说就是移除掉项目中永远不会被执行的代码(dead code),实际情况中,代码虽然依赖了某个模块,但其实只使用其中的某些功能。通过,将没有使用的模块代码移除掉,这样来达到删除无用代码的目的。原创 2023-05-15 15:28:14 · 735 阅读 · 0 评论 -
Vue3获取Dom元素与子组件
选项,导致可能存在null和undefined类型,所以为了解决这个问题才有了上述方案,不过还有另一种方案是。增加了一个是否为空的判断,这主要是为了解决TS报错的问题。,不仅可以得到更完善的类型提示,在编程过程中还可以让编辑器提供更完善的代码补全功能。提供的一个工具类型,可以获取构造函数类型的实例类型,因此将组件的类型声明为。现在在Vue3时代,需要稍微改变一点点方法 ,但是还依然使用ref来获取。在Vue2时我们想获取DOM元素或者组件节点时一般使用。的类型推导还不够智能,缺乏更有效的代码补全支持。原创 2023-03-22 11:00:19 · 1353 阅读 · 0 评论 -
vue核心原理之--理解框架的编译时与运行时
现在我们已经大概了解了什么是运行时编译时编译+运行时、纯编译时等框架的区别,其实在我们使用的现代框架中Vue就是一个编译+运行时的框架。由于它没有编译的过程,因此我们没办法分析用户提供的内容,但是如果加入编译步骤,可能就大不一样了,我们可以分析用户提供的内容,看看哪些内容未来可能会改变,哪些内容永远不会改变,这样我们就可以在编译的时候提取这些信息,然后将其传递给Render函数,Render函数得到这些信息之后,就可以做进一步的优化了。然而,假如我们设计的框架是纯编译时的,那么它也可以分析用户提供的内容。原创 2023-02-13 17:55:07 · 840 阅读 · 0 评论 -
vue核心原理之--现代框架为什么使用虚拟DOM
在权衡了性能消耗、代码的可维护性,Vue(包括React等)主流框架,使用了虚拟DOM这个概念。当然这也仅仅是其中的一部分使用的理由,因为还有响应式等等。。。原创 2023-02-03 11:48:01 · 497 阅读 · 0 评论 -
富文本插件tinymce使用Ctrl+V粘贴图片上传到远程服务器
【代码】富文本插件tinymce使用Ctrl+V粘贴图片上传到远程服务器。原创 2022-09-15 18:17:23 · 1221 阅读 · 0 评论 -
解决vue3引入字体图标iconfont.js时eslint报错的问题
解决vue3引入字体图标iconfont.js时eslint报错的问题原创 2022-08-30 14:49:14 · 2346 阅读 · 0 评论 -
vue3使用ant-design的select实现下拉框滚动分页加载
vue3配合ant-design的select实现下拉框滚动分页加载原创 2022-08-22 11:20:08 · 2919 阅读 · 0 评论 -
vue3 无限下拉滚动插件vue3-infinite-scroll-better 使用详解
支持Vue3的滚动加载插件,所有用法和vue-infinite-scroll一致。并解决了一些bug。原创 2022-06-16 09:19:50 · 4047 阅读 · 0 评论 -
vue核心原理之--图解 Vue3.0 编译器核心原理(Vue3.0源码解析)
图解vue3.0编译器核心原理概览Vue.js作为目前最流行的前端框架之一,一些概念和原理还是需要我们前端开发人员了解与深入理解的。Vue.js涉及的知识点很多,一些重要概念,例如:如何使用proxy实现响应式effect,虚拟DOM的Diff算法及演变过程,渲染器原理的实现、编译器、解析器的工资原理及末班编辑的优化过程等等;现在重点采用图解步骤分析一下编译器的简单工作原理;编译器概念编译器其实就是一段JavaScript代码程序,它将一种语言(A)编译成另外一种语言(B),其中前者A通常被叫做原创 2022-05-31 11:34:03 · 2141 阅读 · 0 评论 -
fullCalendar日程表在Vue项目中的应用
fullCalendar日程表在Vue项目中的应用fullCalendar相关API使用fullCalendar插件在项目中实现日程排版,支持天、月日程转换,自定义事件页面布局通过按钮切换天与月视图的转换,天视图回显具体的时分排版项目,月视图回显缩略信息<div class="order-day-calendar h-100 clearfix"> <div id='calendar' class="h-100" @contextmenu.prevent.stop="st原创 2022-05-06 11:56:55 · 4984 阅读 · 11 评论 -
Pinia学习笔记之--核心概念Plugins and TypeScript
Plugins多亏了一个低级API, Pinia stores可以完全扩展。下面是一些你可以做的事情清单:为stores增加新属性在定义stores时添加新选项为stores增加新方法包装现有的方法改变甚至取消actions实现像Local Storage一样的副作用仅应用于特定的stores使用pinia.use()将插件添加到pinia实例中。最简单的例子是通过返回一个对象向所有stores添加一个静态属性:import { createPinia } from 'pinia'原创 2022-04-15 11:17:23 · 1401 阅读 · 0 评论 -
Pinia学习笔记之--核心概念Actions
ActionsActions相当于组件中的方法。他们可以被定义在defineStore()的actions属性下,它们非常适合定义业务逻辑。export const useStore = defineStore('main', { state: () => ({ counter: 0, }), actions: { increment() { this.counter++ }, randomizeCounter() { this.原创 2022-04-13 18:34:22 · 1151 阅读 · 0 评论 -
Pinia学习笔记之--核心概念Getters
Gettersgetter与Store状态的计算值完全相同。它们可以用defineStore()中的getters属性来定义。它们接收state作为第一个参数,以鼓励使用箭头函数:export const useStore = defineStore('main', { state: () => ({ counter: 0 }), getters: { doubleCount: (state) => state.counter * 2原创 2022-04-08 17:23:19 · 2579 阅读 · 0 评论 -
Pinia学习笔记之--核心概念State
核心概念定义Store在深入核心概念之前,我们需要知道store是使用defineStore()定义的,它需要一个唯一的名称,作为第一个参数传递import { defineStore } from 'pinia'// useStore 可以是任意的定义,比如useUser、useCart// 第一个参数必须是一个在应用程序中唯一的名称export const useStore = defineStore('main', { // 其它配置项})这个名称(也称为id)是必需的,P原创 2022-03-23 17:56:35 · 3167 阅读 · 0 评论 -
Pinia学习笔记之1--概览
Why PiniaPinia (pronounced /piːnjʌ/, like “peenya” in English) is the closest word to piña (pineapple in Spanish) that is a valid package name. A pineapple is in reality a group of individual flowers that join together to create a multiple fruit. Similar原创 2022-03-23 17:54:16 · 1327 阅读 · 0 评论 -
vue3.0+antd实现table内容超出自动tooltip
vue3.0+antd实现table内容超出自动tooltip原创 2021-12-07 15:57:37 · 2037 阅读 · 0 评论 -
Vue3.0 + tsx + ant-design-Vue中使用插槽slot+自定义v-model
vue3.0 + tsx + ant-design-vue中使用插槽slot+自定义v-model原创 2021-11-23 10:44:28 · 4679 阅读 · 4 评论