Vue
文章平均质量分 72
石小石Orz
这个作者很懒,什么都没留下…
展开
-
Vue Router教程【超级详细】
用 Vue.js + Vue Router 创建单页应用,感觉很自然:使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 Vue Router 添加进来,我们需要做的是,将组件 (components) 映射到路由 (routes),然后告诉 Vue Router 在哪里渲染它们。原创 2023-07-21 18:28:32 · 318 阅读 · 0 评论 -
使用Vue实现自定义拖拽指令(v-drag)
v-drag钩子函数的参数 (即 el、binding、vnode 和 oldVnode)。原创 2023-07-05 10:49:03 · 2010 阅读 · 0 评论 -
vue中如何引入插件并使用
ES6模块的引入与使用。原创 2023-07-05 10:43:31 · 956 阅读 · 0 评论 -
这可能是Vue自定义指令最简洁的教程了
new Vue({directives:{指令名:配置对象} 或 directives{指令名:回调函数}})Vue.directive(指令名,配置对象) 或 Vue.directive(指令名,回调函数)直接书写多个Vue.directive可以注册多个自定义插件,但是这样比较麻烦element.text = "哈哈哈哈哈哈"})element.text = "你是狗"})element.text = "你是狗!!!})因此,我们可以使用插件安装的方式进行优化。比如,我们现在定义了一个。原创 2023-07-05 10:39:37 · 335 阅读 · 0 评论 -
vue中的keep-alive的用法
Vue不同组件在进行切换时,组件会被重复销毁,重新渲染。使用 包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。根据上述代码,默认渲染A组件,不渲染B组件。点击按钮时,销毁A组件,渲染B组件。再次点击按钮时,销毁B组件,渲染A组件。添加后,默认渲染A组件,不渲染B组件。点击按钮时,A组件被缓存,渲染B组件。再次单击按钮时,缓存B组件,显示A组件。可见,该方式可节省性能。如,A组件和B组件均存在大量HTTP请求,如果重复切换按钮,请求也会重复进行,对网页的性能耗费较大;原创 2023-07-05 10:34:40 · 180 阅读 · 0 评论 -
vue3+vue-cli配置使用JSX
2、在babel.config.js 内配置插件。原创 2023-07-05 10:28:20 · 413 阅读 · 0 评论 -
Vue中使用axios
/ 请求拦截器// 响应拦截器这里的config就是请求时的配置对象response的内容参考响应结构。原创 2023-07-05 10:26:59 · 155 阅读 · 0 评论 -
Vue2与Vue3相应原理区别
语法: Vue.set( target, key, value ) / this.$set( target, key, value )如图,再点击【增加性别】和【删除年龄】时,数据均发生了改变,但页面没有发生变化。删除方法名为delete,其他用法 一致。Vue.set 或 this.$set。原创 2023-07-05 10:28:00 · 127 阅读 · 0 评论 -
Vue3setup的参数说明
这也意味着即使我们不声明参数的接收,也可以直接在子组件中使用 { {$attrs.msg } }的方式使用参数,但,这确实还是比较麻烦的。这时,我们打印一下子组件的实例对象v会惊喜的发现,$slots上存放了我们传入的虚拟节点(Vnode)这个时候,如果我们在子组件中定义了插槽,这些虚拟节点就会渲染在插槽出现的位置。如果,我们在子组件中不使用props声明接收,打印当前实例vc对象。,我们会惊奇的发现,即使子组件没有声明接受,父组件传递的参数也会被。可以发现,子组件的实例对象vc上的$slots属性为空。原创 2023-07-05 10:23:43 · 513 阅读 · 0 评论 -
vue 下的env、.env.development和.env.production
拿上面三个文件内容打个比方:我们在日常开发时,NODE_ENV值是development,那么Vue就会首先加载.env文件里的内容,然后继续加载.env.development文件里的内容。而当我们打包到服务器后,服务器的NODE_ENV值一般为production,则此时Vue仍会先加载.env文件,然后加载.env.production文件。其次,在按顺序加载文件时,Vue会把后一个加载的文件内容和前面加载的文件内容进行比较,如果存在变量名相同,那么它会采用后一个文件里的变量值为变量的最终值。原创 2023-07-05 10:21:14 · 434 阅读 · 0 评论 -
Vue3中引入Element-plus
首先需要安装unplugin-vue-components 和 unplugin-auto-import这两款插件。然后把下列代码插入到你的 Vite 或 Webpack 的配置文件中(其他地方不用配置)注:如果按照vite的方式(官网给的示例)引入,会报错。打包后体积很大,适合学习,不适合生产。需要使用额外的插件来导入要使用的组件。原创 2023-06-28 17:33:35 · 1048 阅读 · 0 评论 -
Vue3+VueCli+TS官方模板简析
使用vueCli 安装预设的vuex+ts+less+router按方向键 ↓,选择Manually select features,enter手动配置:是我们所需要的面向生产的项目,提供可选功能的 npm 包手动配置,根据你需要用方向键选择(按 “空格键”选择/取消选择,A键全选/取消全选,i反选)对应功能// JavaScript的一个超集(添加了可选的静态类型和基于类的面向对象编程:类型批注和编译时类型检查、类、接口、模块、lambda 函数)// 渐进式Web应用程序。原创 2023-06-28 17:25:27 · 959 阅读 · 0 评论 -
Vue项目打包后都产生了哪些JS请求
如果我们关注性能优化,会注意到vue项目在打包后,会产生若干js请求文件,如或本文将深入探讨Vue项目打包后产生的文件都是什么。注:vue打包后和vue项目直接本地运行后产生的js请求文件一致,为了方便展示,本文采用本地启动项目后产生的文件进行探讨。原创 2023-04-13 09:10:34 · 1261 阅读 · 0 评论 -
2023年了,vue的多路由项目开发,你还在手动拼接路由名?
当我们多人开发一个项目时,不同的人可能开发不同的路由。比如,小明定义了一个名为的路由,张三定义了一个名为的路由假设项目的baseUrl设置为了,那么小明每次开发必须在浏览器输入http://localhost:8080/张三每次开发必须输入http://localhost:8080/est/zhangsan,这非常让人头疼。原创 2022-12-14 17:56:37 · 229 阅读 · 0 评论 -
JS如何优雅的实现模块自动滚动展示
这几天做一个大屏可视化项目时,遇到一个需求,当某区域出现时,让它循环滚动展示数据。原创 2022-12-13 10:48:31 · 468 阅读 · 0 评论 -
前端如何使用JS一键三连还能白嫖视频?
经常玩B站的同学一定知道,登录B站的情况下,如下图:但是,币总是有用完的一天,恰好今天我们遇到一个想一键三连的up主,但是没有币了,该怎么做呢?作为一个前端,搞定这个弹框还不容易吗?上我们的调大法!没有什么能阻止我们给up主一键三连()!原创 2022-12-12 14:05:43 · 283 阅读 · 0 评论 -
vue中如何优雅的实现数字递增特效
前几天项目开发中遇到一个需求,需要在数字更新时,实现其的效果并且,在数字大于时,将单位进行转换,如数字大于10000时,单位从变为万我们以中开发为例,一一实现下这两个需求。原创 2022-12-12 14:02:26 · 715 阅读 · 0 评论 -
【小白基础篇】vue中引入插件、模块包的规则和形式
vue中引入插件、模块包的规则和形式原创 2022-11-18 11:20:35 · 1550 阅读 · 0 评论 -
v-model的实现
v-model的实现原创 2022-11-18 11:11:19 · 77 阅读 · 0 评论 -
5min彻底搞懂vue中的keep-alive
Vue不同组件在进行切换时,组件会被重复销毁,重新渲染。使用 包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。根据上述代码,默认渲染A组件,不渲染B组件。点击按钮时,销毁A组件,渲染B组件。再次点击按钮时,销毁B组件,渲染A组件。添加后,默认渲染A组件,不渲染B组件。点击按钮时,A组件被缓存,渲染B组件。再次单击按钮时,缓存B组件,显示A组件。可见,该方式可节省性能。如,A组件和B组件均存在大量HTTP请求,如果重复切换按钮,请求也会重复进行,对网页的性能耗费较大;原创 2022-11-18 11:06:13 · 214 阅读 · 0 评论 -
Vue2与Vue3响应式原理区别
Vue2与Vue3相应原理区别原创 2022-11-18 11:01:41 · 73 阅读 · 0 评论 -
Vue3中引入Element-plus
Vue3中引入Element-plus原创 2022-11-18 10:49:20 · 3589 阅读 · 1 评论 -
Vue3项目的三种创建方式
Vue3项目的三种创建方式原创 2022-11-18 10:35:38 · 8290 阅读 · 2 评论 -
【Vue系列】Vue中使用axios
Vue中使用axios原创 2022-10-31 18:40:12 · 548 阅读 · 1 评论