![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
lMasterSparkl
这个作者很懒,什么都没留下…
展开
-
element select 下拉框 @change 和 @clear 同时触发问题 以及 下拉同时修改多字段
1描述发现的问题1.需要同时修改两个字段这是需要通过 @change方法去操作数据2而如果此时需要增加 clear清除按钮则需要使用 @clear方法进行清除额外修改字段处理否则只会清除绑定字段3而这时会发现 点击clear按钮会触发 change方法 而此时change没有选中数据项所以控制台会报空指针错误 并且这个问题目前没解决2.目前处理办法是避免同时使用该操作 去除清空按钮如果需要重新输入让运营取消表单重新进行输入即可目前处理方案或者避免同时修改两个字段只使用一个即可如果有解决方案欢原创 2022-03-03 14:30:20 · 4456 阅读 · 0 评论 -
vue @sort-change 条件排序全部数据而不是当前页
1.问题描述最终效果如下:这些排序需要进行全部数据的排序而不是根据当前页面进行排序旧逻辑是将数据全查出来由前端进行分页和排序 我感觉难受就改成后端分页了 然而会导致只排序当前页的问题 所以需要修改排序逻辑也移动到后台中2.前端代码如下1.html代码:<el-table border ref="multipleTable" :data="gameList"原创 2021-03-16 15:35:19 · 2768 阅读 · 0 评论 -
el-table-column 多选 selection 展示数据及分页处理
1.实现效果首先表格数据要有多选框上面勾选的数据会在下面进行展示下面表格支持单条移除操作同时会根据临时勾选数据及之前已勾选的数据将数据赋值给上面表格的勾选框中2. 代码1.html代码 上边表格关键部分代码 及分页<template > <el-table border ref="multipleTable"原创 2021-03-16 15:04:17 · 2861 阅读 · 0 评论 -
el-table-column :filters 多条件后台筛选全部数据分页处理
1.问题描述最终效果如下 将排序字段传入后台进行处理需要通过筛选条件 不是排序 筛选全部后台数据而不是当前页数据查找相关资料2.解决过程1.首先查找相关官方文档发现是筛选当前页 这样只能前端进行分页及筛选才可以实现功能 如果数据量大的情况下很麻烦2.查找相关博客资料主要参考 参考资料2 博客链接 element ui table+分页 筛选全部数据-demo3.最终代码vue页面中放上部分关键代码 有些地方需要自行进行修改<el-table border原创 2021-03-16 12:35:35 · 3973 阅读 · 0 评论 -
el-date-picker 限制可选时间
1描述设置时间可选值为第一次选择的时间点上下一周即可效果如下代码如下 <el-date-picker v-model="searchDateRange" type="daterange" :picker-options="pickerOptions" format原创 2021-02-22 10:05:44 · 553 阅读 · 0 评论 -
js foreach 的坑 不能直接return
foreEach多次执行回调函数,回调函数中使用return(我们的代码都在回调中)没法直接终止foreEach,只能终止单次的回调原创 2021-02-02 11:34:45 · 427 阅读 · 0 评论 -
vscode 常用快捷键
alt 上下 移动代码alt shift 下 复制当前行todo原创 2021-01-15 16:05:08 · 107 阅读 · 0 评论 -
js 给model对象进行赋值操作
this.form1={}; // this.form1.username = row.username; 大佬说不正确的写法是这个 this.$set(this.form1, 'username', row.username) //这种是正确的写法原创 2021-01-10 16:56:18 · 1187 阅读 · 0 评论 -
js 中string转换为map对象
背景我是用avue的form表单 做一个联动 期间有一个接口只返回了个string类型的数据而官方文档的联动只有select下拉框的联动 而下拉框联动是用dic类型的数据所以需要进行封装或者后端调整返回类型这里尝试使用js进行修改 dicFormatter:(res)=>{ //这里手动将后台返回的string 类型title值 改为map类型进行select映射 因为input输入框的映射没弄出来 var r = "{'title':'"+re原创 2021-01-10 16:46:45 · 4480 阅读 · 1 评论 -
h5静态页面 引入 css js文件乱码
问题描述静态项目引入 css js 文件 进行展示结果样式没生效同一目录下其他静态h5文件正常显示 只是该页面有问题解决从问题文件右下角可以看到不是utf-8的文件格式但是无法手动修改点击时会提示什么硬编码啥的其他正常显示的文件右下角为正常的utf-8文件格式接下来修改文件编码进行验证手动新建记事本复制代码并保存为utf-8格式的文件即可验证发现已经可以正常显示样式了觉得有用记得点个关注...原创 2020-12-27 23:40:48 · 202 阅读 · 0 评论 -
根据屏幕动态设置fongtSize大小
<script> (function(win, doc) { var docWidth = doc.documentElement.clientWidth; if(docWidth <320){ docWidth = 320 } var rem = docWidth / 10.8; doc.documentEleme...原创 2020-12-25 15:58:13 · 212 阅读 · 0 评论 -
vchart 图表空数据时暂无数据显示在左下角
如果觉得有用记得点个关注描述vue项目使用v-chart 图表进行数据展示的时候发现空数据时提示的暂无数据位置在左下角没有居中如图查找官方文档发现demo中用注释有标出需要引入css样式文件// import ‘v-charts/lib/style.css’加入后即可正常显示参考链接v-chart官方文档对应位置...原创 2020-12-25 11:31:00 · 1066 阅读 · 0 评论 -
avue-data-display 数据展示保留小数点
背景使用avue数据展示空间avue-data-display 时发现传入9980 前端进行/100后进行展示进行了四舍五入并且没有保留小数 需要进行优化踩坑情况1. 设置decimals参数通过这个参数设置会导致所有数据都会保留小数 有些情况展示不合理,比如:单位个的时候也会展示小数decimals:1,2. 赋值时进行保留小数位处理2.1data.sumIncome/1002.2data.sumIncome/100.02.3(data.sumIncome/100.0).toFix原创 2020-12-14 20:39:58 · 3484 阅读 · 0 评论 -
js保留两位小数
item.sumIncome=(item.sumIncome/100).toFixed(2);原创 2020-12-16 10:10:37 · 136 阅读 · 1 评论 -
vchart引入
代码如下// main.jsimport Vue from 'vue'import VCharts from 'v-charts'import App from './App.vue'Vue.use(VCharts)new Vue({ el: '#app', render: h => h(App)})参考链接v-chart官方文档原创 2020-12-09 20:34:47 · 279 阅读 · 0 评论 -
vue 项目页面卡死原因排查
问题描述点击后台管理某一菜单发现直接卡死,没有其他报错信息,整个网页鼠标变为手指状态不能进行任何操作问题排查首先是通过注释代码发现问题是出在以下代码中 <basic-container> <h4>教师指标数据</h4> <avue-crud ref="crud" :data="tableData" :table-loading="tableLoading"原创 2020-12-09 17:53:04 · 12464 阅读 · 0 评论 -
前端配色推荐
需求前端需要选择颜色 而且很多 因为没设计所以只能找找相关网站下面网站都是从推荐链接中复制的Material PaletteNew Flat UI Color PickerFlat UI ColorsCoolorsSkala ColorMaterial UI ColorsBrand ColorsPaletton0 to 255Colour LoversAdobe Color CCColllor相关资料:收藏 | 12个超好用的配色网站 ...原创 2020-12-02 18:34:26 · 170 阅读 · 0 评论 -
js 根据条件查找数组对象属性值
如题想要查找数组对象的某个属性是否相同 data() { return { iosDicData:[ { label1: '6001', value1: 600, productId: "C1" }, { label1: '12001', value1: 1200, p原创 2020-11-27 16:41:22 · 3192 阅读 · 1 评论 -
javascript foreach的使用
1.场景通过foreach循环数组并添加到另一个空数组中进行展示2.代码 tempData1.forEach(function(item){ browseData.push(item); });参考链接菜鸟教程对应部分原创 2020-11-12 15:52:55 · 84 阅读 · 0 评论 -
vue 页面跳转至顶部方式
方式1window.scrollTo(0,0);方式2document.body.scrollTop = document.documentElement.scrollTop = 0;方式3scrollBehavior 组件方式4 通过a标签跳转<a id="jumpTop" href="#" style="visibility: hidden"></a>document.getElementById('jumpTop').click()方式5 修改route文原创 2020-11-09 18:57:32 · 376 阅读 · 0 评论 -
通过 html2canvas 生成海报截图导致图片模糊的优化方法
1.问题基本信息使用vue制作h5页面,需求是生成带二维码的海报进行分享。通过qrcodejs2生成指定url路径的二维码通过使用html2canvas生成指定div的截图信息问题:生成的海报模糊2.解决办法不多废话直接贴关键代码body部分: <div class="poster_bg"> <div class="share_title"> <p style="margin: 0.5rem">长按图片保存并转发&l原创 2020-10-21 17:30:15 · 1722 阅读 · 0 评论