- 博客(42)
- 问答 (21)
- 收藏
- 关注
RSS订阅原创 Vue+Element-UI el-table表格根据指定条件动态合并行span-method
el-table标签上定义span-method方法methods里增加spanMethod方法return {rowspan: row.rowspan, // 需要合并的行数colspan: 1} else {// 不合并return {colspan: 0。
2024-03-26 17:11:52
807
原创 js ES6判断字符串是否以某个字符串开头或者结尾startsWith、endsWith
startsWith：startsWith方法用于检查字符串是否以指定的字符串开头。endsWith：endsWith方法用于检查字符串是否以指定的字符串结尾。总结：startsWith和endsWith方法是在JavaScript中用于检查字符串开头和结尾的便捷方法，能够提高字符串处理的效率和可靠性。注意事项：在使用startsWith和endsWith方法时要注意区分大小写，避免出现意外的匹配结果。另外，需要注意处理特殊字符和空字符串的情况。
2024-02-29 14:53:19
749
原创 优化axios封装之配置使用AbortController取消重复请求 防止用户频繁操作调用接口
当数据量过大请求缓慢时用户点击按钮或者tab标签页快速重复调用同一个请求时，会导致数据错乱，当只需要最新的请求数据，并且中断上一个重复请求时，可以利用axios的CancelToken去中断之前的请求。ps:由于不是所有请求都需要这个逻辑 所以我封装的时候增加了请求配置项removeCache，如果传了则取消重复请求，这样就不会影响其他的请求了。
2023-12-27 16:56:36
1123
原创 ElementUI之el-progress动态修改进度条里面文本颜色与进度条色块统一
通过行内style样式动态给整个progress赋颜色 再在样式里给进度条文字单独设置颜色为默认继承父级颜色就ok啦。
2023-11-08 16:58:50
1951
原创 音乐免费下载mp3格式+音频格式转换+剪辑音频+合并音频教程
如果你是vip可以直接下载vip的歌曲，如果不是选择不是vip的歌曲进行第一步的操作。打开网站后，把需要合并的所有音频文件拖进来，再选择转换格式，点击合并等它合并就可以了。进入网站后 拖入我们的mp3文件 再选择开始结束时间 点击保存 就可以下载到本地了。由于实际需求是只需要前30s的音频 我们借助音频处理网站对刚下载的mp3进行剪辑。由于下载出来的格式是.m4a 我们最终需要mp4格式 所以需要借助网站转换一下。选择文件后 选择要转换的格式 我这里选了mp3 然后点击转换。完成后点击下载 转换就可以了。
2023-11-07 11:04:47
878
原创 css矩形盒子实现虚线流动边框+css实现step连接箭头
由于项目里需要手写步骤条 且实现指定状态边框虚线流动效果，故使用css去绘制步骤条连接箭头和绘制边框流动效果。
2023-10-30 14:31:56
1014
原创 vue前端实现打印功能并约束纸张大小---调用浏览器打印功能打印页面部分元素并固定纸张大小
需求是打印指定div实现小票打印功能。调用浏览器的自带打印功能只能实现打印可视区域，所以这里采用截图+新窗口打开打印去实现此需求。
2023-10-16 14:33:36
1499
原创 el-table表格动态设置最大高度 高度根据窗口可视高度大小改变自适应
由于表格内容过多，如果不给高度限制，每页100条数据的情况下，去操作底部的分页或者其他功能都需要划到数据最底部操作，用户体验性较差。解决方法是让表格一屏展示，超出部分滚动展示。
2023-09-13 15:47:41
3756
原创 vue2/vue3使用vue2-scale-box进行pc端大屏适配
【代码】vue2/vue3使用vue2-scale-box进行pc端大屏适配。
2023-07-10 14:30:40
2358
4
原创 vue2+vue-cli使用unocss
在根目录中添加 unocss.config.js 文件是为了提供更细粒度的配置选项给 @unocss/webpack 插件。通过这个配置文件，你可以定制化 UnoCSS 的行为，例如定义主题样式、配置插件、启用或禁用特定功能等。在 Vue CLI 项目中，默认情况下，你应该在根目录创建一个 unocss.config.js 文件来配置 UnoCSS。这个文件会被 @unocss/webpack 插件自动识别并加载。具体配置请查阅官网文档。
2023-07-05 14:29:00
2715
6
原创 JS 使用reduce对数组求和、求平均值、求最大值、求标准差、求方差，使用Js计数和去重计数
利用reduce求和求平均值求最大值最小值标准差和方差,利用js自带数组方法求计数,去重计数
2023-05-05 13:54:46
851
1
原创 Vue中$emit调用父组件异步方法模拟.then实现
需求：有一个封装好的弹窗子组件，点确认时$emit父组件删除方法，父组件删除接口调用成功后需要调用子组件close()方法。方法：1可以直接$refs.dialog.close()关闭弹窗。方法2：可以模拟.then在子组件实现这一逻辑。
2023-03-20 11:07:02
1322
原创 vue项目 抽离出script标签里的逻辑代码
vue文件的template内容较多，不便于开发，写逻辑和样式的时候要翻很久，此时将script逻辑代码抽离就可解决这一问题通常情况下，在单 .vue 文件开发很方便，但是当业务逻辑起来了，那么经常需要修改 script 和 template 部分，用编辑器分屏也不是那么好操作，故有了组件 script 分离。
2022-11-24 15:24:39
1067
1
原创 Element DatePicker 日期选择器禁用单个指定日期
需求：禁用某个时间范围 例如[‘2022-11-11’, ‘2022-11-29’]
2022-11-10 10:02:50
535
1
原创 el-table多选表格type=“selection“获取当前行数据给多选框增加插槽逻辑
对于el-table需要增加new的标识 根据当前行的某个字段判断。如果是普通的el-table很好做直接在每行第一个td的插槽里写逻辑就行了，但是因为这个是selection多选的表格，用插槽在type="selection"里写插槽后就导致多选框没了，单独插槽里写多选框就要重写写多选的逻辑。给el-table上增加:row-class-name=“rowClassName” 动态判断 这里可以获取当前行。但是发现el-table-column上获取不到当前行 获取不到row.isRed。
2022-10-20 10:15:35
3085
原创 el-tree 树结构实现父子不关联(check-strictly) 且能全选、反选、半选
解决：单独把全部抽离出来，拉平树结构数据，根据选中长度同拉平后的数据长度进行对比实现全选、反选、半选。
2022-10-18 15:02:35
4897
1
原创 小工具合集
链接：https://www.remove.bg/zh链接：https://www.iodraw.com/链接：https://www.diagrams.net/DevDocs 将多个 API 文档组合在一个快速、有条理且可搜索的界面中链接：https://devdocs.io/链接：https://tinypng.com/链接：https://picdiet.eula.club/链接：http://color.oulu.me/链接：https://www.manypixels.co/gal
2022-07-08 17:19:15
131
原创 vite+vue3商城项目笔记
2.安装依赖 启动项目3.安装插件4.安装Element Plusmain.js里引入然后我们的main.js就长这样：5.安装windi css框架在vite.config.js里引用（贴一下我vite.config.js的全部代码）在main.js里引用安装WindiCSS IntelliSense代码提示插件src里创建router文件夹+文件夹底下添加index.js文件main.js里引入7.路由配置在vite.config.js里引入path别名设置route
2022-06-28 14:51:43
508
原创 vue项目常用utils工具函数
个人笔记帖–持续记录n1.遍历树形数据，删除其空children项问题：编写联级选择器时后端每层都有children，空的children也返回了，导致显示空选项解决方案：过滤空children解决代码：【vue】遍历树形数据，删除其空children项......
2022-05-17 11:49:18
1619
原创 vue+elementui项目中遇到的坑/难题
1.Pagination 分页需求：不需要这么多只需要展示3个 但是传:pager-count="3"会报错，因为官方限制了数字范围，不能小于5…
2022-04-22 16:07:08
4149
原创 Echarts示例大全 Demo合集网站
Make A Pie 已经暂停服务啦，平时项目写echarts时还是需要这种类似的demo网站啦，cv加上细节修改会节约开发时间，给大家整理一些替代网站~同时也是记录贴，记录发现的一些替代网站Made a pieMCChartisqqwMakeAPiePPChartanalysis待续...
2022-04-08 22:13:32
22629
9
原创 echarts-demo记录
echarts-demo记录1.双环形图效果图：// 颜色let colorList = [ '#0F8A91', '#87651D', '#188B56'];let colorList1 = [ '#0BF7FF', '#FFB522', '#22FF91'];let data = [10,22,15]let seriesOption = [ { name: 'small', type: 'pie
2022-04-07 17:03:16
1064
原创 项目初始化-准备工作
项目初始化相关ElementUi安装1.项目下载element-ui包npm i element-ui -S2.在main.js中引入elementimport Element from 'element-ui'import 'element-ui/lib/theme-chalk/index.css';Vue.use(Element)3.重启项目4.用一下element的组件测试一下是否安装成功<el-button type="primary">哈哈打不到我吧~</
2022-03-25 10:15:09
1471
原创 vue+elementui el-switch按钮的文字居内
效果图代码UI图需求是将文字放在switch里面 ， 而elementui默认的文字是在外面，这时候就要改样式了，可根据需求更改下面代码样式。 <el-switch v-model="allActive" active-text="关" inactive-text="开" active-color="#3979FC" inactive-color="rgba(0, 0, 0, 0.2)">
2022-03-23 09:50:15
3257
原创 vue-router 路由跳转 解决跳转到当前路由报错问题
在vue项目中 当路由跳转当前页面时会报错vue-router.esm.js?8c4f:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/". at createRouterError (webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2066:15)
2022-02-16 15:08:51
2105
原创 vue+elementui 防止按钮在请求未完成时被多次点击
按钮频繁操作会导致发多个请求，消耗性能而且请求混乱会导致一些bug出现，所以在写按钮操作的时候就应该考虑周全，这里利用flag去防止频繁操作按钮html部分：<el-button type="primary" :disabled="!isClick" @click="isClick&&handleLogin()">登录</el-button>script部分：<script>export default { data() { r.
2022-02-16 15:01:48
1912
原创 Vue3.0+element-plus实现表格的增删查改
最近浅学了下vue3.0，做了个表格的demo，有增删改查的功能，记录一下index.vue文件：<template> <div class="box"> <el-button class="new_btn" type="primary" @click="handleNew" >新增</el-button > <el-table :data="studentInfo" border style="width:
2022-02-11 17:15:32
13044
32
原创 Vue3 provide和inject的使用
provide / inject官网解析：provide / inject1.provide父组件/祖先组件向子组件/子孙组件传递数据时，写在父级组件里，接收两个参数，第一个参数是 key，即数据的名称；第二个参数为 value，即数据的值2.inject子组件/子孙组件接收从父级/祖先组件传递过来的数据，写在子组件里，接收一个参数 key，即父组件或祖先组件传递的数据名称示例：父组件a.vue<template> <div class="a">
2022-02-08 16:51:36
937
2
原创 【笔记】Vue router 解决跳转到当前路由报错问题
解决方案：在vue的路由文件里 我的是router.js(或者是router文件夹里的index.js)// 解决跳转到当前路由报错问题// 底下这两句如果引入过就不用引入了import Vue from 'vue'import VueRouter from 'vue-router'const originalPush = VueRouter.prototype.pushVueRouter.prototype.push = function push(location) { return
2021-12-21 11:22:51
584
原创 vue中 前端根据word模板导出页面中的表格和内容为word文档
需求将页面中这两个表格区域导出为word格式的文档 这两个表格是根据word模板去写的页面1.下载插件yarn add docxtemplater;yarn add pizzip;yarn add file-saveryarn add jszip-utils2.script标签里引入插件import Docxtemplater from "docxtemplater";import PizZip from "pizzip";import PizZipUtils from "pizzi
2021-11-29 11:49:34
2652
3
原创 在Vue中使用Echarts 使用+封装+笔记
一 . 准备阶段1.下载npm install echarts -S有时候版本过高会报错 换成 "echarts": "4.2.1"2.全局引入// 在main.js中引入echartsimport * as echarts from 'echarts'Vue.prototype.$echarts = echarts3.创建文件Charts.vue以及盒子 <div ref="chart"></div>4.一些网站1.Echarts官网配置项都在官网，附
2021-11-29 11:30:56
1178
3
原创 Vue项目中 改变elementui DateTimePicker时间选择器（el-date-picker） 图标icon位置居右 日期控件图标居右
elementui中el-date-picker图标居右1 . 需求 :2.代码:template部分<template> <el-date-picker v-model="dateRange" type="daterange" :clearable="false" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" ></el-
2021-08-12 14:12:25
11871
12
空空如也
CSS怎么选中active下的第一个red元素
2022-05-13
怎么选中active下第一个red元素
2022-05-13
el-form-item绑定的经纬度的正则表达式-90~90怎么表示呀
2022-03-17
为什么我的文件不能以index.vue命名呀
2022-02-15
video标签放了198M的视频 播放不了
2021-11-24
页面一加载 mounted和watch怎么才能只执行一次
2021-09-26
设置浏览器标签页图标 报错 引用的图片在浏览器输入地址能打开 用在html里就报错
2021-09-23
Echarts仪表盘配置如何让指针变成圆角
2021-09-06
为什么element没有做年范围选择
2021-08-28
编辑功能报错,这是打包出现的问题吗?
2021-08-24
vue中的element ui的el-tree默认选中和点击不获取父级数据
2021-08-19
elementui里面的switch怎样避免多次点击频繁问题
2021-08-11
用elementui的骨架屏为什么报错说我没注册这个组件
2021-08-05
elementui中的时间选择器 如何禁止选择开始时间 只让用户选择结束时间
2021-07-22
vue项目中删除功能发axios了也成功了可是页面上还有我删除了的数据
2021-07-21
vue+elementui的项目表格怎么导出为pdf文件呀
2021-07-19
调查询接口报错500 是前端的问题还是后端的问题呀
2021-07-16
elementui的表格表头有的有红色的*号怎么加上去
2021-07-15
element-ui的树形控件怎么让一级标题和二级标题字体不一样
2021-07-14
TA创建的收藏夹 TA关注的收藏夹
TA关注的人