- 博客(31)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 postcss-pxtorem 将px转为rem，实现不同分辨率页面不受影响
这个插件不支持行内样式的转换，包括el-table-column中设置的width和min-width。在根目录下创建postcss.config.js文件。
2025-03-14 17:15:52
98
原创 el-table表格高度没有撑满容器时，不显示最外层边框
1、首先给el-table的父元素设置固定高度，这里是结合业务需求当表格内容不能撑满一页时，不需要显示分页组件，所以动态计算高度，根据项目业务进行调整；2、el-table设置max-height：100%，可以解决撑不满一页没有多余的边框，但出现了一个新的让人头大的问题，就是内容撑满后没有出现滚动条。怎么办呢，想一个区分两种情况的办法，当不满一页时保持max-height属性，否则就设置height：100%3、通过js计算表格一个最多显示几行数据。显然红色圈出的部分是不需要的。
2025-02-25 09:05:14
241
原创 el-scrollbar+el-tree超出宽度出现横向滚动条
CSS部分，给el-scrollbar__view设置display: inline-block是重中之重！再结合overflow-x:auto，横向滚动条自然而然就出来啦~1、HTML部分，在el-scrollbar元素上添加 view-style="height:100%;
2025-02-25 08:42:22
270
原创 Vue进行页面等比缩放后，鼠标悬停echarts错位高亮
解决办法是给echarts加上zoom、transform:scale、transform-origin这三个属性将页面的比例进行还原。项目中使用vue+echarts实现大屏页只展示河北省地图，并且鼠标滑过显示井的详情信息。因为页面进行了等比缩放，所以每次鼠标移入地图区域时不高亮，移到该区域的右下方才高亮。导致整个页面缩放了0.775倍，所以出现错位的情况。
2024-08-15 15:36:09
408
原创 window.print()实现打印功能
想要去掉滚动条，尝试缩放页面比例，使用vue-print-nb都不行，直到最后将vxe-table换成了原生table，奇迹般的好了！使用window,print实现打印功能，页面中使用了vxe-table表格，所以打印出来的表格中带有横向滚动条。
2024-08-07 17:02:12
495
原创 el-upload手动上传多张图片
需求为一次性上传多张图片，并可以为图片添加描述信息，且后端接口一次只能传一张图片。循环遍历上传的图片列表依次处理字段并请求接口，等所有的接口请求完成后再关闭弹框。先将上传图片转成base64格式，放入imageList再表格中展示。再点击按钮时请求后端接口实现上传。
2024-07-11 13:43:17
484
原创 show-overflow-tooltip内容超出时不在鼠标当前位置显示全部内容
如图所示，当鼠标移入第一行时，没有在第一行的上方显示全部内容，而是跑到了表格下方。修改之后就是正确的了。
2024-07-01 14:17:48
381
原创 element-plus解决el-select的下拉框位置错乱
查了很多都说设置popper-append-to-body为false，亲测无效。正确做法是将teleported属性值改为false，再去修改。如图下拉框的位置错乱显示，想要在el-select的正下方。inset这个属性用于控制下拉框的位置。修改之后的样式就可以了。
2024-06-17 14:32:03
1196
4
原创 Vuex+echarts实现点击左右两侧菜单栏，重新绘制echarts
3、store/index.js文件中存储一个变量，用来记录侧边栏展开或者收起的状态，并在mutations中可以改变这个状态的值。1、想实现点击左右两侧的按钮，侧边栏展开或收起，中间的echarts部分根据宽度的变化重新绘制。6、在封装的echarts文件中watch监听vuex中存储的变量的变化，重新渲染即可。首先需要安装vuex，，，使用命令：npm install vuex;5、在组件中引入mapState、mapMutations。4、在main.js中引入store/index.js。
2024-06-06 09:38:13
393
原创 Echarts柱状图每个柱子都设置不同的渐变色，达到视觉上的立体效果
【代码】Echarts柱状图每个柱子都设置不同的渐变色，达到视觉上的立体效果。
2024-05-31 15:30:36
379
2
原创 Echarts 交换legend图例中图标和文字的位置，修改图标的大小，图例在右侧显示，图形在canvas的左侧显示
折腾了一个多小时，在快要放弃的时候终于实现了，皇天不负有心人！这个配置相当重要，center的第一个值决定了环的位置。
2024-05-17 17:26:18
2097
原创 Echarts 在x轴实际位置绘制竖线
注意：想在x轴实现在实际数值的位置上绘制竖线，xAxis中type的值为category可不行哦，type的值改为value才可以！这里是添加了两个xAxis，一个type为category，一个为value，结合markLine实现。不知道为什么，对我这个option写的灰常满意，哈哈哈哈哈，表扬下自己😊😊😊。使用echarts实现以下效果。
2024-03-22 17:24:39
2292
1
原创 当npm install时出现80 packages are looking for funding run npm fund for details 然后npm run serve启动失败
1、当出现80 packages are looking for funding run npm fund for details警告时，按照提示运行npm fund 之后再执行npm run serve启动失败。3、最后删掉node_modules包，执行npm install --no-fund之后执行npm run serve启动成功。2、运行npm fund 或者npm audit fix之后执行npm run serve启动失败。
2023-11-30 10:19:39
926
1
原创 vue3使用van-uploader上传图片显示上传中.
van-uploader组件默认没有提示，选择图片后直接显示在页面上，对于用户来说感知不到图片上传的进度和过程，如果上传失败用户也无法感知。无论上传成功与否都将status设置为空，取消上传提示文字。解决：给files中添加status和message属性。上传图片提示用户图片正在上传中，请稍后。打印上传的文件files查看属性。
2023-09-27 15:43:11
898
2
原创 vue3 使用vant组件库中的Toast报错：Toast is not defined
网上搜了很多办法，main.js中将toast挂载到实例，组件中使用this.$toast还是报错。在组件中单独引用import { Toast } from “vant”，结果还是报错。全局引入还在探索中。
2023-09-27 14:48:25
1843
2
原创 解决使用vant组件库中van-calendar日历不能回显接口返回的日期问题
给van-calendar设置ref，通过this.$refs.设置的值(接口返回的日期)就ok啦！所以，将代码中的最小日期修改为1990-01-01后，在mounted中重新修改组件的值就可以了。点击calendar组件发现日期还停留在当前日期，而没有回显到接口返回的那一天。查看官网api发现设置的min-date最小日期为今天。接口返回的日期格式为年-月-日。
2023-09-21 16:45:18
1379
原创 el-date-picker 获取当前月往前推算3个月、6个月的日期
举例：当前月为2023-08，那么点击1个月时显示2023-08至2023-08，点击3个月显示2023-05至2023-08。需求：实现点击1个月、3个月、6个月的时候，el-date-picker 控件分别显示当前月、当前月-3、当前月-6；点击6个月显示2023-02至2023-08。
2023-08-25 15:07:29
710
1
原创 el-date-picker 设置picker-options属性限制日期选择范围失效
需求不能选择当前月之后的月份，在element-ui官网上查到了picker-options但是一直没有生效。后来百度才知道该属性已弃用，需要改成disabled-date属性。在methods方法中写disabledDate完美解决。
2023-07-11 15:08:59
2761
3
原创 uni-app框架checkbox选项互斥checked为false，复选框确勾选了
1、html部分<!-- 多选 --><view v-if="question.type === 1" class="card-area"> <checkbox-group @change="checkboxChange"> <view :key="`${index}${question.id}`" v-for="(item, index) in question...
2022-05-07 17:39:56
2615
4
原创 uniapp答问卷倒计时显示
1、先判断当前问卷是否设置了允许最长答题时间，如果没有设置则答题时间不受限制，如果设置则进行倒计时计算2、进入领取页面计时生效，所以开始答题时当前时间戳 - 后台返回的时间戳为耗时差，再用最长答题时间 - 耗时差为剩余答题时间// 倒计时计算if (_this.consumeTime > 0) { // 耗时 = 当前时间 - 开始答题时间 let usedTime = (new Date().getTime() - _this.startTime) / 1000 / 60; //
2022-04-25 17:59:57
741
原创 解决uniapp使用uParse解析富文本点击a链接无法跳转问题
1、首选在html引入uParse组件的地方加上 @navigate="navigate" 方法<uParse :content="question.title" @navigate="navigate"></uParse>2、在navigate方法中直接把路由换成a链接的href值，点击即可跳转了navigate(href) { window.location = href;}...
2022-04-19 11:55:08
2648
2
原创 关于uniapp多个radio,下一题仍然保留上个题目的选择的解决办法
注：:key绑定的值必须是唯一的，不能是:key="index"！！！！！！！！每个选项index都是从0增长，所以每个题目的选项index都是相同的，不是唯一标识。
2022-04-14 14:23:12
1039
原创 百度小程序bdparse解决rich-text富文本无法渲染video视频
1、下载bdparse源码：https://gitee.com/sootou/bdparse将bdparse包放在小程序根目录下：3、在swan页面引入 <import src="../../../bdParse/bdParse.swan" />4、css页面引入 @import "../../../bdParse/bdParse.css";5、js页面引入 var bdParse = require('../../../bdParse/bdParse.js');6、在j
2022-04-01 17:10:47
582
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人