自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(21)
  • 收藏
  • 关注

原创 vue中渲染列表时,判断内容是否超出设定高度,进行展开收起操作。

在列表渲染时,有的内容过长时,会使页面过高,影响页面查看和美观,所以就需要判断当 内容高度 是否超出当前 盒子高度 ,如果超出,则显示展开/收起按钮,如果不超过,则不显示。直接上代码:<template> <div class="mywork_box"> <template v-if='data.length>0'> <div class="work_list" v-for='(item,index) in data...

2021-12-21 18:18:53 3505

原创 vue-quill-editor 修改上传图片或粘贴图片为 上传到服务器 方式。

如何下载引入就不说了,自行百度。这个默认上传图片是将图片转为了base64了,所以在上传图片后,将数据传给后端时,数据过大,导致各种报错问题, 还有它也可以直接粘贴图片进去也是base64, 这里将上传图片更改为上传到自己服务器上,返回的是一个地址,这就方便多了。直接开始:先说组件结构:index.vue 就是组件 ,修改 粘贴图片上传在这个里面quillConfig.js 是富文本的配置项 修改点击图片上传在这个里面代码 :index.vue<templ..

2021-11-25 11:17:55 2368 2

原创 微信开发者工具打不开 报错网络连接失败 解决方法

有时打开微信开发者工具会一直报错这个,还会一直弹出代理错误等等…直接说方法:下载地址: https://www.charlesproxy.com/latest-release/download.do这里下载charles这个软件 用于网络代理。这个下载安装时自己选好安装目录,这个安装后没有桌面快捷方式,还得自己去找。安装好就是个这 瓶子,然后打开,等一会打卡就这样,能看到各种网络地址然后再次打卡微信开发者工具,就可以正常打开了,如果还不行,就打开任务管理器,可能有残留的进程,全部关.

2021-08-12 16:57:41 2711

原创 vue中使用vue-animate-onscroll滚动动画插件,在main里引入报错不能使用。

最近在使用vue-animate-onscroll插件,做元素滚动到视图进行动画效果。但发现按官网上写的 在main里引入后会一直报错。这是官网的引入用法这就一直报错然后找到他的源码内容。给他提取出来在一个js文件中,在main里直接引入这个js文件,完美好用。放上这个js文件var ScrollAnimate = () => { const e = e => "string" == typeof e, t = (e, t, n = "") => e.class

2021-08-05 11:54:59 1512

原创 vue中读取本地的excal文档内容。

在vue中如何读取本地excal和xls数据内容。这里使用xlsx插件安装 npm install xlsx --save使用: // 上传文件,这里只是测试,自己可以加上文档格式判断等 fileChange(e) { var file = e.target.files[0]; const fileReader = new FileReader() fileReader.onload = (ev) => { try {

2021-08-05 11:43:56 303

原创 vue使用京东的NutUI库的骨架屏,添加高亮滑过动画

最近在使用vue+NutUi库在做移动端,说实话,京东这个库真的难用,问题真多了,不过都使用大半了,再换也来不及了。在使用骨架屏组件时,官方文档上都有滑过的高亮动画了,但使用出来是没有的。这就使用处来的,太单调了只能自己添加了,.vue-skeleton-row { position: relative;}.vue-skeleton-row::after { content: ''; width: 100%; height: 100%; positi

2021-07-01 11:36:40 580

原创 v-viewer图片预览插件设置setDefaults 不生效的问题

最近在vue移动端项目里使用v-viewer这个图片预览插件,设置配置项的时候,一直不生效,搜了下也都是一样的设置。折磨了半天,坑。1、安装依赖npm install v-viewer --save2.引入import Viewer from 'v-viewer'import 'viewerjs/dist/viewer.css';Vue.use(Viewer);3.配置先放错误不生效的配置// 都是这种配置,根本不生效,折磨半天Viewer.setDefaults({ Option

2021-07-01 11:23:27 2710 8

原创 vue中使用京东的NutUI时 在js模块中使用Notify等提示信息

最近在使用vue加NutUi做移动端的H5页面,在封装的requet的js文件中想要使用notify的提示信息,按照文档上写的引入根本不生效。最后打印出来 import NutUI from ‘@nutui/nutui’; 的这个NutUI .Notify 这个方法,...

2021-06-23 10:05:20 759

原创 element中表头添加边框,右侧边框不显示的问题

在最近的大屏项目中使用element的表格,要固定表头,还要修改原样式,其他样式都好修改,唯独给表头添加边框时,会有问题,右侧边框显示不出来。就像这样,试了各种办法,因为固定表头后,下方内容就会出现滚动条,所以它这个表头的末尾添加了一个空的th和滚动条的宽度一样影响的。起初给这个空标签添单独加左边框也能实现,但是当内容长度达不到滚动时或者空内容时,就不好使了,最后发现被一个属性影响了这就简单了 更改这个属性为默认值真解决了 /deep/.el-table .el-table__header

2021-05-17 17:55:08 2517

原创 在vue中将后端返回的二进制图片流转换为base64展示在页面中

有时从后端请求获取到的图片为二进制的流文件,需要展示在页面中,可以将二进制转换为base64即可。这里是在vue项目用的axios请求。直接上代码 deviceDoDownload().then(d => { console.log(d); if (d.data) {//如果返回的有值,则使用返回的底图 // 先将二进制的流转为blob,注意后面type一定要设置为图片格式 let blob = new Blob(

2021-01-21 13:49:47 4187 2

原创 vue项目启动时报hello@1.0.0 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf...

今天打开以前的vue项目时,发现所有的项目都打不开 报错了。这个错误demo@1.0.0 dev: webpack-dev-server --inline --progress --config build/webpack.dev.conf.js第一反应以为是webpack版本冲突问题,可是以前的项目一直运行正常啊,怎么会突然不行了,搜了一下都是前两个方面的问题。1.就是webpack版本问题,uninstall webpack 重新安装2.说是node-modules依赖有问题了,删掉 重新

2020-12-10 10:42:37 2287 4

原创 vue中监听iframe页面中的值,并解决audio标签在谷歌不能自动播放的问题

项目中有一个iframe引入的大屏页面,大屏页面会根据WebSocket后端返回的状态进行报警,但是这个audio标签在谷歌浏览器里不能自动播放,找了很多文章,绕不开这个限制,最后只能找一个折中的办法,将audio标签放在app.vue页面中,项目肯定要先登录了,就肯定要点击了,这样就有交互了,audio标签就能自动播放了。这个是非父子组件之间交互使用的,习惯这样写 main.js里Vue.prototype.ev=new Vue()这个是app.vue页面,放了一个audio标签, <

2020-11-27 14:59:27 2138

原创 用iview的表格方式封装element中的table表格和分页

因为经常做后台项目,需要使用表格分页,UI组件一直用的element,但是这个表格用起来感觉很乱,就像在写原生的table,而不像一个组件,没有iview的表格功能那么好用,iview表格是用一个data数据跟columns参数 就可以驱动整个表格,需要配置啥只用在columns里更改即可,方便完美,所以项目中一直加载了两个ui库,按需加载了iview的表格,其他的全部使用的cnd引入的element,简直不要太难受,所以就抽空,将element的表格按照iview的那种格式封装了一下。 大致是完成了,想要

2020-11-13 10:43:51 478

原创 vue中实现换肤效果,运用less很简单

最近在做一个后台管理系统,最后做的差不多等测试呢,想着如何给项目实现换肤功能呢,项目是vue项目,用的less。最开始想的是在less里面定义好变量,然后点击更改皮肤的时候,修改变量的值,这样,整个项目中用到变量的地方都更改了。但是,这里有但是,后来想了想 ,如何动态的修改less里面定义的变量,这给卡住了,百度了下也没找到方法,夭折了。如果有小伙伴知道,求告知。最后想的是用less里的函数来...

2019-12-30 17:59:52 1790 6

原创 vue中axios的封装与使用

vue中现在的请求数据大多数人都是使用axios来请求数据,不过还有的小伙伴每次请求还是直接在组件中就开始请求了,并没有进行封装。这样后期维护更改什么的都很费劲。上代码,开始1.首先,先给axios安一个家,在src下面建一个文件夹,叫什么随您。如下图,我建了一个request的文件夹,来放置封装的axios和接口文件,其中axios.js就是进行axios封装的文件,上面的apis是每个模块对...

2019-12-26 15:23:07 310

原创 vue中后台管理登录后的token管理

在做后台管理系统的时候,登录后token管理很重要。上代码,有瑕疵,有待改善,见谅。import Vue from 'vue'import Router from 'vue-router'import { canTurnTo, setTitle } from '@/lib/util';//第一个是判断权限的函数import { route } from './routes'//路由列表,路...

2019-12-26 14:33:21 1008

原创 js中数组里包含数组进行去重。。

js中一个数组里包含了多个数组,如何对该数组去重里面的小数组。话不多说,直接开始,我这是一个笨方法,如果小伙伴有更好的方法,欢迎告知。 var arr = [[1, 2, 3], [2, 3], [4, 5], [1, 3], [1, 2, 3], [2, 3]];//好比有这么一个数组,里面是一个个小数组,很明显前两个小数组和最后面两个数组是一样的,需要对其去重。 var new...

2019-12-26 09:54:39 1414

原创 vue项目中打包完成后如何外部链接打开项目中的某个路由页面?

vue项目开发打包完后 如何从外部链接跳转到项目中的某个路由页面?因为vue是单页面应用,所以项目打包完后只有一个index.html文件,然后一切跳转都是有内置的路由来实现,但是当我们从外部链接跳转的时候,,好比这样要直接从外部跳转到paintList这个路由页面,可是这时候会报错404,提示找不到页面,因为你打包完后就只有index.html文件,并没有paintList.html这个文件,...

2019-10-21 18:13:52 4015 1

原创 vue中如何使用SM4国密来加密?

最近做一个项目,登录接口的账号密码两个参数后端规定的是用国密SM4来加密,以前从来没用过这个方法,也百度了一下,但文章了了无几,而且基本内容都是一样的,因为这种加密方式大部分都是java用来加密的,百度上关于SM4加密的大部分都是说的java如何实现,但关于javascript如何加密就只看到有一个js代码,是一个大佬根据java的代码改编的,但不知道为啥使用这个代码加密出来的数据后台解密不了,后...

2019-09-02 17:21:06 7069 8

原创 vue中跳转路由如何传递一个对象过去?

有时在跳转路由的时候,因为好多参数在另一个页面也需要使用,所以想要将整个对象传递过去,可以用下面这个方法。// 跳转路由传递对象参数var arr=JSON.stringify(this.songList)this.$router.push('/shop/'+encodeURIComponent(arr))这里跳转路由的时候,先用JSON.stringify将参数转换一下,有人会将转换的...

2019-09-02 16:55:53 17744 3

转载 Web端大量图片同时加载卡顿问题的优化之旅

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...

2019-07-19 20:51:25 317

空空如也

空空如也

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

TA关注的人

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