自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(114)
  • 资源 (2)
  • 问答 (1)
  • 收藏
  • 关注

原创 【Vue3 + Element Plus】纯前端实现本地数据分页

Vue3 + Element Plus 实现纯前端本地分页并封装组件。

2023-07-28 09:41:01 1314 1

原创 【Vite + Vue3 + TS】unplugin-auto-import自动引入配置及Eslint报错解决

在Vue3和TypeScript项目中,Vue、VueRouter中的函数需要在每个页面导入,为提高开发效率,我们需要对此进行自动导入。配置完成效果图如下所示:可以看到页面并没有引入。

2023-05-30 11:00:10 4089 1

原创 【Vue3 + Vite + TS】 引入移动端调试面板Vconsole(全网最简单、最实用)

【代码】【Vue3 + Vite + TS】 引入移动端调试面板Vconsole(全网最简单、最实用)

2023-04-19 10:38:22 2008 1

原创 Vue3+ts使用sensors(神策)进行埋点

【代码】Vue3+ts使用sensors(神策)进行埋点。

2023-04-19 10:21:24 1226

原创 【微信小程序】封装公共支付方法并唤起支付

调用后端接口获取支付参数,使用获取的参数唤起微信支付组件

2023-02-06 09:50:35 679

原创 【 Vue3 + Vite + setup语法糖 + Pinia + VueRouter + Element Plus 第五篇】【完结篇附源码】

在第四篇中我们学习了mixin公共方法封装,VueRouter的使用以及配置权限路由,本期我们将讲述Pinia,并使用Pinia和Axios接口数据完成登录功能以权限路由改造Pinia持久化PiniaAxios登录Pinia权限路由改造。

2023-01-10 14:25:37 675 2

原创 【 Vue3 + Vite + setup语法糖 + Pinia + VueRouter + Element Plus 第四篇】(持续更新中)

在第三篇中,我们主要学习了组件的封装与使用以及组件间传值和表格、表单的用法mixinVueRouterVueRouter路由跳转权限路由PiniaPinia存储用户信息PiniaPinia路由拦截PiniaStroage。- `mixin` 公共方法封装和使用- 项目中导入 `VueRouter`- 使用 `VueRouter` 完成 `路由跳转`、获取`路由信息`- `VueRouter` 模块化、路由拦截器- `权限路由`配置

2023-01-09 10:38:13 706

原创 【 Vue3 + Vite + setup语法糖 + Pinia + VueRouter + Element Plus 第三篇】(持续更新中)

- 封装列表`模糊查询`组件- 实现`新增` `编辑` `删除` `模糊查询` `重置` 功能- 实现`表单校验`功能- 实现`组件间传值`- 实现`组件间传值`

2023-01-06 15:04:41 1533 6

原创 【 Vue3 + Vite + setup语法糖 + Pinia + VueRouter + Element Plus 第二篇】(持续更新中)

Vite3配置env环境变量、配置@路径别名,使用Vue3基础语法糖和生命周期函数调用方法,Vue3 引入 Axios 并进行二次封装,使用Element Plus 和 Api 请求完成对列表数据的获取以及列表渲染

2023-01-05 15:01:06 804 2

原创 【 Vue3 + Vite + setup语法糖 + Pinia + VueRouter + Element Plus 第一篇】(持续更新中)

【 Vue3 + Vite + setup语法糖 + Pinia + VueRouter + Element Plus 第一篇】(持续更新中)

2023-01-04 17:49:41 704 1

原创 【长按图片保存到相册】Vue移动端H5页面实现长按图片保存到手机功能

【长按图片保存到相册】Vue移动端H5页面实现长按图片保存到手机功能

2022-12-07 14:24:07 4264 6

原创 【JavaScript小数相加】封装公共方法

【JavaScript小数相加】封装公共方法

2022-12-05 18:27:59 579

原创 【Node版本管理工具n】保姆级教程

在显示版本的界面,可以使用上下箭头来选择你想要使用的node版本,然后按回车即可选择。版本已经安装了,则切换的这个node版本。命令查看所有已经安装的node版本.版本没有安装时,则安装这个版本。报错的话一定要在前面加一个。

2022-11-16 16:55:38 5477 5

原创 windows系统完全卸载并重装Node(亲测可用)

A、node -v 查看 node 版本B、npm -v 查看 npm 版本2、安装完成后,文件目录如下图如果 npx 为 +,会安装一个新的包 。npx是一个工具,旨在提高从npm注册表使用软件包的体验 ,npm使得它非常容易地安装和管理托管在注册表上的依赖项,npx使得使用CLI工具和其他托管在注册表,大大简化了一些事情。此处的环境配置主要配置的是 npm 安装的全局模块所在的路径,以及缓存cache的路径,之所以要配置,是因为以后在执行类似:npm install express [-g] (后面的可

2022-11-09 17:44:32 7541

原创 【Vue项目美化】NProgress顶部进度条详细配置

important;}建议写入中,并在main.js中引入也可直接写在App.vue中。

2022-11-03 10:59:48 1380

原创 【闲得无聊】写个web版功德无量附代码+静态资源

【代码】【闲得无聊】写个web版功德无量附代码+静态资源。

2022-10-18 15:15:22 695

原创 【小程序分包】两分钟让你轻松搞懂

小程序顾名思义就是体积小、打开速度快,如代码体积过大会影响打开速度,由此诞生主包和分包的概念在构建小程序分包项目时,构建会输出一个或多个分包。每个使用分包小程序必定含有一个主包。所谓的主包,即放置默认启动页面/TabBar页面,以及一些所有分包都需用到公共资源/JS脚本;而分包则是根据开发者的配置进行划分。在小程序启动时,默认会下载主包并启动主包内页面,当用户进入分包内某个页面时,客户端会把对应分包下载下来,下载完成后再进行展示。优点。

2022-10-14 14:32:45 524

原创 【vue-video-player】局部注册视频播放插件并设置中文

vue-video-player设置中文网上的各种解决方法都是全局注册,看腻了,真的看腻了。

2022-10-14 10:33:23 1165 5

原创 【即时通讯持续更新中】一篇文章让你实现面对面聊天

下载地址:https://github.com/tencentyun/TIMSDK/tree/master/MiniProgram/IMSDK。官方文档地址:https://cloud.tencent.com/document/product/269/36887。我们如果想在自己的项目中使用IM即时通讯的话,首先要把需要的文件引入项目中。本文主要概述使用小程序实现即时通讯功能。

2022-10-13 10:13:33 751 1

原创 Vuex 终极秘籍总结

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。你可以理解 Vuex 为全局变量,与 data 不同的是,Vuex 的值刷新不会改变、所有页面均可使用、调用 Vuex 的方法和属性。

2022-09-26 14:44:02 1064

原创 H5页面唤起小程序 & 小程序唤醒H5并携带参数

因为页面要调用支付,为了支付授权之后重定向页面会携带query参数,所以尽量不要使用?传参。

2022-09-06 15:51:18 2703

原创 【中鸡前端+Vue面试精选】

缺点:由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。,指哪些可能由多个值构成的对象,保存在堆内存中,包含引用类型的变量本身,实际上保存的不是变量本身,而是指向该对象的指针。执行顺序:开始新的宏任务 => 宏任务执行 => 宏任务执行完毕 => 判断有没有可执行的微任务。同步任务:直接进入执行栈,在主线程上排队执行的任务,只有前一个任务执行完毕才会执行下一个任务。,当函数A被执行完时,函数A的作用域不会被释放。...

2022-08-26 14:55:32 316

原创 Vue获取地址栏携带的所有参数并解决hash模式和history模式兼容性

Vue获取地址栏携带的所有参数并将其传给后端

2022-07-11 14:29:44 1687

原创 Vue中使用mixins混入

组件在引用之后相当于在父组件内开辟了一块单独的空间,来根据父组件props过来的值进行相应的操作,本质上两者还是泾渭分明,相对独立。mixins则是在引入组件之后,是将组件内部的内容如data等方法、method等属性与父组件相应内容进行合并。相当于在引入后,父组件的各种属性方法都被扩充。简单理解:减少代码冗余,提高开发效率,复用组件数据,方法等,以提高开发速度新建引入注册并使用mixins五、全局混入(不推荐)...

2022-07-08 23:41:16 2161

原创 Vue多环境打包配置,根据命令生成不同打包文件名

2.使用env配置文件设置Axios的baseURL3.配置scripts脚本运行命令模式在package.json文件下的scripts对象中配置mode

2022-06-24 14:57:18 3811 1

原创 Vue中axios请求二次封装

特性mian.js引入并挂载到Vue实例中2.1二次封装axios请求在scr目录下新建utils文件夹,并在utils文件夹下新建request.js2.2创建API请求在src目录下新建api文件夹,并在此文件夹下新建index.jsVue页面使用

2022-06-10 16:32:37 1782

原创 Vue抽离公共方法并全局注册使用

举例说明:抽离一个公共下载方法创建两个页面的原因是确定全局方法在不同页面都可使用别忘了在main.js引入router三、封装axios请求assets文件夹下新建api文件夹并在此文件下新建home.js四、创建公共下载方法在assets文件夹下新建utils文件夹并在此文件下新建downLoadTempFile.js......

2022-06-10 16:01:27 3063

原创 Vue全局注册防抖函数自定义指令

JavaScript防抖函数,建议前端所有接口都加入防抖方法

2022-05-16 10:49:16 400

原创 在Vue中使用JavaScript防抖

Vue中使用JS防抖

2022-05-13 15:10:30 2889

原创 Element组件el-scrollbar滚动条包裹el-table表格不显示横线滚动条以及滚动条重叠问题

Element组件el-scrollbar滚动条包裹el-tbale表格不显示横线滚动条以及滚动条重叠问题

2022-04-01 10:29:18 4379

原创 Vue前端环境搭建(最简单,最全)

Vue前端环境搭建包括node npm

2022-04-01 10:22:26 2001

原创 firefox不兼容a标签文件下载

a标签下载文件不兼容的firefox问题

2022-02-24 16:00:14 1649

原创 vue项目中使用阿里iconfont图标(下载并在本地引用)

vue项目中使用阿里iconfont图标(下载并在本地引用)step1step2step3在scr/asstets/css目录下新建icons文件夹,把图中所需要的四个文件放进去即可

2021-12-16 11:25:39 2160 2

原创 一篇文章教会你使用Vue-pdf完成对后台返回的文件流进行PDF预览功能

一篇文章教会你使用Vue-pdf完成对后台返回的文件流进行PDF预览功能前言:封装vue-pdf组件为预览页面,通过unstructured.vue路由传参形式跳转到预览页面一、unstructured.vue// 预览async preview(row){ // 这个代码我不多做解释,接口请求而已 let res = await downLoadSourceFile({ bucket:'pdf', objectName:res_str+'.pdf', origi

2021-12-16 11:17:33 3196

原创 ElementUI级联选择器择任意项的两个缺陷,我不说,你也不知道吧

1.ElementUI官网级Cascader 级联选择器这样的话效果是实现了,但是存在两个问题:1、只能点击圆圈才能选中,点击文字 label 没有效果2、点击圆圈后理想是自动收起下拉,但这个是点击下拉框之外的地方才可以收起。2.以下就是我的解决办法<el-cascader // 一定要加ref属性稍后解决第二个问题 ref="refHandle" v-model="uploadFileValue" :options="options" placeholder="试

2021-12-02 10:38:10 1436 4

原创 ElementUI框架中el-tree左侧小三角修改自定义图标

ElementUI框架中el-tree左侧小三角修改自定义图标一、先看下效果图二、css样式注意,样式放在scope里不生效,如果必要请加上/deep/样式穿透// 禁止旋转.el-tree .el-tree-node__expand-icon.expanded{ -webkit-transform: rotate(0deg); transform: rotate(0deg);}//有子节点 且未展开.el-tree .el-icon-caret-right:before{

2021-11-23 09:41:10 5580 2

原创 Vue组件触发另一个组件的方法

Vue组件触发另一个组件的方法前言:当点击申请之后,头部组件上的值要动态发生变化,所以我们采取事件总线的方式1.全局注册bus总线// main.js 将$bus挂载在原型上Vue.prototype.$bus = new Vue();列表页面async shenqing(row){ // 请求后台接口 let res = await addApply(row.id) // res.code为0 即没有错误 if(res.code == 0)

2021-10-20 09:44:22 3610 3

原创 深夜学姐问我在Vue中Echarts柱状图如何自定义顶部亮点

深夜学姐问我在Vue中Echarts柱状图如何自定义顶部亮点先看效果图我们可以看到图中图表不仅有渐变色,同时柱状图顶部位置有一个不相同的顶部亮点(图片)接下来,我们一起来实现一下这个效果1. HTML部分<div id="ParkingLotLoadRanking" ref="ParkingLotLoadRanking" style="height:16.875rem;width:25%;"></div>2. JS部分 // 获取DOM元素 let m

2021-10-09 15:01:55 4969 10

原创 el-tree设置默认选中checkbox且复选框值改变触发事件

<el-tree :data="treeData" show-checkbox default-expand-all node-key="id" ref="tree" @check="checkedList" highlight-current :props="defaultProps" :default-chec

2021-09-27 17:38:10 4678

原创 Element el-date-picker表单校验和数据回显问题

vue项目中使用Element中的el-date-picker组件做必填项和数据回显前言:最近做项目的时候遇到这个问题,百度好几天得不到解决,这里给大家详细解释下。话不多说,先上效果图1.el-date-picker表单校验关于这个问题,我百度了许久没有解决,之后看到一位博主写的是change事件,还要给校验的规则加上...

2021-09-03 09:06:20 11520 16

【Vue3 + Vite + setup语法糖 + Pinia + VueRouter + Element Plus】开发框架

该项目集成了 Vue3 Vite setup语法糖 Pinia VueRouter Element Plus Axios 等,目前公司必备开发知识、已封装为二次开发框架,减少项目构建以提升开发效率,基础语法偏多,更适合于基础较弱的同学。其中包括了Element Plus 表格操作、弹窗组件的封装和复用,mixin公共方法的封装,以及后台管理系统中最重要的权限路由管理以及动态渲染左侧菜单等。以及对构建工具 vite.config.js 进行的简单配置、Pinia数据持久化的解决方案,嵌套路由的配置等。

2023-01-09

Vue毕业设计(两小时使用Vue+Element Ui完成一个后台项目)

作业提交系统: 前台使用vue+element ui+axios完成用户登陆,注册页面 以及vue中的导航守卫 axios基本配置,首页使用elment完成导航布局以及主要内容嵌套路由出口 完成学生列表展示 和使用elment步进器完成修改密码的功能 后台使用node开启后台api 前台只需要输入正确的api即可获取数据库数据 下载建议:可作为毕业设计,代码没有进行封装 适合初学者使用 适合element新手使用 即看即懂。

2021-06-25

Vue毕业设计-两小时使用Vue搭建完整的后台管理系统(附源码+后台+数据库+文档)

一个基于vue-template-admin的快速开发框架 轻轻松松让你掌握vuex后台管理

2021-05-31

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除