vue
文章平均质量分 56
是迪迪呀.
写博客是为了记笔记!
展开
-
纯前端实现复杂表格数据的导出——XLSX+FileSaver
使用XLSX + FileSaver 纯前端实现复杂表格的导出功能原创 2022-11-10 19:45:00 · 915 阅读 · 1 评论 -
vue动态设置页面title
vue项目,动态设置页面title原创 2022-09-15 20:00:00 · 6034 阅读 · 0 评论 -
字典回显避免重复调用后台接口
解决前端项目,表格中或页面中多次使用到字典回显,同时多次调用后台字典接口的问题原创 2022-09-07 20:30:00 · 411 阅读 · 0 评论 -
Cesium添加自定义弹窗并设置随地图移动位置移动
项目中使用`Cesium`制作三维地图,在地图上铺点,对点位进行点击,弹出自定义弹窗(`form`+`charts`),且弹窗随地图一起动,原创 2022-04-12 21:00:00 · 4108 阅读 · 3 评论 -
vue-cli3与vue3
vue-cli3与vue-cli2创建项目目录区别;vue3与vue2区别;vue3和vue-cli3区别;vue3目录是vue-cli3,跟vue3还是vue2没有关系。原创 2022-03-22 20:46:24 · 3597 阅读 · 0 评论 -
vue项目配置打包测试环境/生产环境
vue项目配置打包测试环境/生产环境:开发环境运行命令:npm run serve生产环境打包命令:npm run pro测试环境打包命令:npm run build步骤:1.项目中添加一个配置ip的js文件,比如如下的ip-config.js(位置不重要)2.在生成axios实例的时候引入,封装baseUrl3.在main.js中全局引入封装号的axiosimport http from "@/utils/request";Vue.prototype.$http = http;原创 2022-03-22 20:00:00 · 12245 阅读 · 5 评论 -
vue3无config文件夹打包后页面空白问题
vue3项目没有config文件夹,vue2项目有config夹,打包之后页面空白问题解决(全)原创 2022-03-11 19:00:00 · 1259 阅读 · 0 评论 -
debugger和控制台都看不到的error
问题记录:在之前的项目中我想要的功能一直出不来,控制台也没有报错,打debugger跟踪问题到下图代码块中,然后走到红框位置自己debugger断掉消失,可是问题仍然在…作为一名程序员,不怕bug,但是怕不知道bug是什么,现在正是这种情况,后来请教了公司的前辈,加了两行代码,如下图:使用try{}catch(){},最后问题就在catch中打印出来了,说是构造函数问题,才发现断掉的地方Models没有对应属性,给BpmnButton.Models添加上就好了总结:不是很难的东西,但是本人第一原创 2021-11-18 15:32:38 · 372 阅读 · 0 评论 -
openLayer地图全屏事件的监听
写博客是为了做笔记!一、openLayer地图添加全屏控件二、添加全屏监听1.引入库2.添加监听三、Tips一、openLayer地图添加全屏控件在进行全屏监听之前肯定需要给地图添加全屏控件,使之有全屏的功能 import { FullScreen } from 'ol/control' map.addControl(new FullScreen())二、添加全屏监听1.引入库import { FullScreen } from 'ol/control'2.添加监听 let.原创 2021-10-15 17:16:14 · 479 阅读 · 0 评论 -
dataV大屏在vue中的使用
随着信息化的发展,大屏展示的需求越来越多,使用e-charts一个一个的做配置太麻烦,于是找到了封装好的dataV,直接拿来用就可以实现酷炫的大屏效果。原创 2021-06-16 22:15:37 · 10140 阅读 · 22 评论 -
JS Proxy代理
文章目录前言一、proxy是什么?1.语法2.参数二、使用步骤1.初学2.入门总结前言最近在项目中改别人的代码碰到了js中使用proxy代理的情况(代码较复杂,且涉及到内部代码不适合分享,本篇文章只是举了几个小例子),之前对它的了解只是停留在可以通过proxy代理配置解决跨域问题的基础上,然后就了解了一下,发现此proxy非彼proxy,js中的proxy代理也有大用处。一、proxy是什么?Proxy 也就是代理,Proxy 对象用于创建一个对象的代理,从而实现基本操作的拦截和自定义(如属性查原创 2021-06-10 23:18:16 · 575 阅读 · 0 评论 -
axios的拦截与封装
一、http.js文件:import axios from "axios";import isPlainObject from "lodash/isPlainObject";import ipConfig from "../../src/config/ipConfig.js";import qs from "qs";import { message } from "ant-design-vue";const http = axios.create({ baseURL: ipConfig.s原创 2021-06-07 23:39:48 · 114 阅读 · 2 评论 -
vue加载视频流,实现直播功能
文章目录前言一、视频流是什么?二、vue加载rtmp视频流1.方法一:video.js2.方法二:ckplayer三、vue加载hls视频流1.index.html中2.video-player.vue文件:前言最近在项目中有一个播放监控站点图像视频的功能(类似与直播),然后对此进行了一个记录与总结!在此功能中,后台本来给的是rtmp格式的视频流,后在网上找了几种方式,发现rtmp视频流需要使用flash播放器,然而各大主流浏览器已经放弃flash,因此最后又改用hls格式的视频流,最终完成这个功能原创 2021-06-07 23:39:18 · 4210 阅读 · 4 评论 -
vue之moment使用
文章目录一、moment是什么?1.日期格式化:2.相对时间:3.日历时间:4.多语言支持:二、使用步骤(例:默认查询时间24小时之前~当前时间)1.引入库2.在main.js中全局引入(也可单独在使用的文件中引入,具体看需求)3.在需要使用日期的地方使用三、日期格式一、moment是什么?moment 是一个 JavaScript 日期处理类库。注:以下所有时间相对于现在时间:2021/05/11/18:42 星期二1.日期格式化:moment().format('MMMM Do YYYY.原创 2021-05-11 19:47:28 · 38317 阅读 · 6 评论 -
vue之lodash使用
文章目录一、lodash是什么?二、使用场景(本篇文章以 lodash.pick 为例)1.需求2.在知道`lodash.pick`之前:3.在知道`lodash.pick`之后:三、总结一、lodash是什么?Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。Lodash 通过降低 array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单。 Lodash 的模块化方法 非常适用于:遍历 array、objec原创 2021-05-11 19:46:11 · 5579 阅读 · 0 评论 -
vue批量引入组件、注册和使用
文章目录一、使用场景二、使用步骤1.文件目录2.HTML代码3.js代码4.css代码(可不看,写出来只是为了代码完整性,拿来可以直接运行展示)三、总结一、使用场景在日常开发中,经常会有这样一种情况: import A from 'components/A' import B from 'components/B' import C from 'components/C' import D from 'components/D'遇到这种重复的代码,就在想,是否可以进行以下优化,一次性全部原创 2021-05-10 15:31:53 · 1167 阅读 · 0 评论 -
VectorTileLayer更换style
问题描述:底图(矢量切片图层的url)不变,但是需要添加上不同的style形成动画轮播的效果。给图层更换样式不难,找到对应的feature,使用feature.setStyle就可以了。但是我在项目中遇到的问题是获取不到feature,或者获取到的feature不可用(我一同事就遇到了使用feature.setStyle不生效的情况,最后也没有找到原因,最后每次更换样式时添加不同样式的图层,然后添加了一堆的layers,导致地图非常庞大)。这篇文章就是讲的就是没有feature的时候如何更换样式——l原创 2021-04-26 18:34:00 · 1031 阅读 · 0 评论 -
vue项目中的字典问题
前言我们在项目中经常会遇到一个字典问题,就是一个从后台获取的一个固定的数组,然后在系统中的很多地方都会通过select选择框用到。如果每次用的时候获取,就会经常出现两个问题:1.这个数组数据量过大的时候,有可能点击select下拉框,数据还没有返回来,导致select无法选择;2.每次都重新请求后台,当数据量过大,且同一页面其他接口也比较多时,导致页面加载缓慢。那怎么解决呢?如下:一、在utils中写一个dict.js的文件,内容如下://系统中封装好的axiosimport { httpPo原创 2020-12-28 16:31:20 · 4006 阅读 · 5 评论 -
vue的mixins的工具的封装
写博客是为了记笔记一、vue的mixins的工具类是什么?就是我们再写后台管理系统时,涉及到大量的增删查改调用后台接口的重复的方法,我们可以把这些方法集合起来直接作为一个js文件,后面可以直接引入,数据和方法都不需要声明,直接使用即可。再概括一下,就是请求后台接口的方法的集合。二、js工具代码具体注释我会直接写在代码里,然后大家可以自己直接对照着代码看代码如下://这里引入了qs,使用npm install qs就可进行安装,在后面下载的方法里用到(get方法拼接参数),//如果没有这个需求,原创 2020-11-06 16:36:06 · 1172 阅读 · 0 评论 -
el-table的formatter属性的用法
一、formatter是什么?formatter是el-table-column的一个属性,用来格式化内容。(比如后台给你返0或1,你需要展示成“否”和“是”)二、详细使用1.知道formatter之前:代码如下(示例): <el-table :data="tabledata"> <el-table-column label="类型" prop="type"> <template slot-scope="scope">原创 2020-09-30 16:44:13 · 24572 阅读 · 1 评论 -
el-table实现增加/删除行,某参数跟着变
效果展示:当在中间删除或添加行时,最左侧步骤的内容也会跟着变。代码展示:首先,html中的el-table代码:<el-table-self :data="setList" style="width: 100%" max-height="250"> <el-table-column align="center" prop="orderNum" label="步骤" width="80"> <template slot-scope="原创 2020-09-22 19:26:25 · 885 阅读 · 0 评论 -
vue中登录页按enter键直接登录
写博客是为了记笔记!!html代码:(样式部分可以不用管,主要是一个click方法和一个keyup.enter的方法要注意)<div class="login-btn" @click="submit(loginForm)" @keyup.enter="submit()"> <span style="margin-left:12%">登录</span> </div>js代码:(created中添加键盘事件)created()原创 2020-09-18 17:24:55 · 2069 阅读 · 3 评论 -
vue之watch监听总结
vue之watch监听总结(记笔记类别)写法1:这种写法比较简单,注意,这种方法只能监听一些简单数据类型 watch: { //isDragging是需要监听的数据 isDragging(newV,oldV) { if (newV) { this.delayedDragging = true; } this.$nextTick(() => { this.functionTest() }); }原创 2020-08-19 17:40:46 · 263 阅读 · 0 评论