前端vue
lucky*girl
靡不有初鲜克有终
展开
-
element 级联选择器获取对象内容
【代码】element 级联选择器获取对象内容。原创 2023-02-09 14:59:10 · 899 阅读 · 0 评论 -
批量导出为pdf(横向导出)
导出pdf预览后因纵向余留空白太多,因此改为了横向导出,并将空白间隙去除。原创 2023-01-12 17:28:04 · 350 阅读 · 0 评论 -
vue批量导出pdf(含分页及解决最后一页空白问题)
1、问题概述:由于vue模板的限制,导出pdf只能打印出来一页。因此我单独写了一个h5页面,将该页面放在服务器上,接收需要导出内容的id即可完成分页导出。附加解决导出的最后一页是空白的问题。原创 2023-01-10 15:17:26 · 2344 阅读 · 0 评论 -
哀悼日:实现网页整体置灰
-webkit-filter(滤镜)有十种效果,分别是:grayscale 灰度sepia 褐色saturate 饱和度hue-rotate 色相旋转invert 反色opacity 透明度brightness 亮度contrast 对比度blur 模糊drop-shadow 阴影原创 2022-12-04 02:51:57 · 106 阅读 · 0 评论 -
父子组件传值且刷新父子组件的值
1、 this.$forceUpdate()this.$nextTick(() => { this.isShow = true//重建组件 })原创 2022-12-04 02:48:20 · 143 阅读 · 0 评论 -
微信小程序生成海报并保存在本地(组件开发)
商品图片和二维码生成海报原创 2022-12-04 02:41:03 · 1007 阅读 · 0 评论 -
微信小程序跳转其他小程序
两种方式1、跳转外部链接:2、使用 webView注意!!!需要对跳转链接的域名进行配置打开微信公众平台--微信公众平台开发管理--开发设置--服务器域名--request域名 添加即可 在webView页面接收原创 2022-12-04 02:03:01 · 1493 阅读 · 0 评论 -
uniapp封装日历组件
1、需求分析:获取当前日期的后5天,前15天日期组成一个数组。并按照3屏展示出来。且支持左右切换。如下图: 2、思路:先获取指定日期区间,放在数组中。7天为一个周期,切割成3个数组。使用uni的swiper绘制页面。声明一个新的数组包含3个对象,与轮播图的数据相对应原创 2022-12-04 02:47:19 · 1334 阅读 · 5 评论 -
项目上线后首次加载慢的解决方案
1、使用路由懒加载(开发时尽量使用路由懒加载)2、使用gzip压缩(最高效,至少压缩一倍)原创 2022-09-08 11:59:58 · 862 阅读 · 0 评论 -
富文本编辑器:图片和文件可上传至服务器
1、需求:商家可上传平台规则(规则内容包含图片且可以放大伸缩、文件上传至服务器、可插入表格、插入代码等数据、数据不保存时可以直接预览、预览后直接发布也可以保存富文本编辑器中的内容,保存后数据展示在列表中再进行发布)(1)将图片上传至服务器,拿到图片的oss返回给后端,这样上传的数据量会小很多从而减轻服务器的压力。(3)因为预览时数据还没有保存,此时需要先把富文本中输入的数据本地保存缓存下来。(3)将富文本中的数据在点击预览按钮时用localStorage缓存下来,然后在预览的页面去取。具体可以看以下代码。.原创 2022-08-19 00:03:55 · 971 阅读 · 0 评论 -
uni实现折叠展开功能(使用$set添加标记)
vue通过$set改变状态,控制文章的展开收起原创 2022-08-13 17:46:41 · 578 阅读 · 0 评论 -
解决VUE深度监听对象不起作用
1、需求:只要对象中的任意一个属性发生变化,则改变参数值。2、思路:深度监听对象里面的值,只要对象里面的值发生改变则改变入参。3、Bug:监听的对象中新旧值相同。4、解决方案:在计算属性中将对象改为数组,再去监听即可。...原创 2022-07-06 10:01:38 · 2577 阅读 · 3 评论 -
vue解析特殊符号转化为标签
需求:将数组中每个对象里的字符串特殊符号解析成标签,并加上样式。思路: 写一个公共的方法,将特殊字符转化为标签。 在数组循环中直接转化会受影响,写一个公共方法复用性更强,易于维护。...原创 2022-06-24 15:46:35 · 1513 阅读 · 0 评论 -
Vue用highlight.js使代码高亮显示
1、引入highlight.jsnpm install highlight.js2、 在main.js中引入// 引入 highlight.js 代码高亮工具import hljs from "highlight.js";// 使用样式,有多种样式可选import "highlight.js/styles/github-gist.css";// 增加自定义命令v-highlightVue.directive("highlight", function(el) { let blo原创 2022-05-28 15:12:41 · 3158 阅读 · 0 评论 -
Vue表格头部实现气泡弹窗并封装图片和样式路径
1、iview中引入表格,并在render函数中写入img标签,实现划过标头出现气泡弹窗。2、由于表格中几乎每个标头都需要出现气泡弹窗并引入图片,故写了公共的样式和图片路径。3、实现效果:4、代码实现:{ title: '期末余额(元)', width: 140, key: 'aaa', render: (h, params) => { return h('div', ..原创 2022-06-17 11:50:58 · 562 阅读 · 0 评论 -
Vue实现tab切换渲染不同表格并操作单选按钮
1、如上图:切换个人或团队操作时显示不同列表,并能单选个人或团队下的护理员。且切换个人或者团队时保留团队或个人勾选记录,个人或团队下的护理员只能勾选一个。2、实现方式:引入iview组件中的table表格,在render函数中添加单选框。(注意此时可以用id作为互斥条件)3、代码实现 <Drawer class="modelwu" :title="dispatchTitle" v-model="doawerShow" width="660" @on-close="drawarCl...原创 2022-05-16 20:56:03 · 3102 阅读 · 1 评论 -
Http传输协议(包含对get和post请求的封装)
get和post传参,入参封装,携带参数传值区别原创 2022-05-01 19:01:37 · 1273 阅读 · 0 评论 -
VUE根据url下载文件
方法一: const downloadRes = async () => { let response = await fetch(url); let blob = await response.blob(); let objectUrl = window.URL.createObjectURL(blob); let a = document.createElement('a'); a.href = obje原创 2022-04-15 14:16:55 · 18478 阅读 · 9 评论 -
Vue动态计算百分比配合vux插件
1、首先进入vux官网中引入插件XProgress 组件使用教程 | VUX - 基于 WeUI 和 Vue 的移动端组件库https://doc.vux.li/zh-CN/components/x-progress.html也可以引入其他进度条框架2、由官网显示,进度条的范围是0-100这时候就需要我们动态获取内容并计算啦 <x-progress :percent="gteProgress(myord.serviceTimes,myord.svcday)" :show-..原创 2022-03-04 09:37:44 · 3063 阅读 · 2 评论 -
前端学习进阶之路
As we all know 前端是需要不断学习的 尤其在这个大前端的年代。因此要给自己定下一个阶段性目标。跟上时代的小步伐。只要思想不滑坡 方法总比困难多。下面说一下我平时的一些学习方法。1、关注一些微信公众号。(通勤时间较长的话 地铁上的时间可以利用起来 通过语言理解的知识要比视频学习到的知识更能提升自己)我关注的一些公众号:CSDN vue中文社区 JS每日一题 React 程序员黑叔 掘金 前端sharing 牛客网2、每天观看一小时学习视频...原创 2022-02-22 10:33:26 · 564 阅读 · 0 评论 -
vue动态改变css样式
要求:切换按钮后改变css的样式实现思路:循环数组,然后添加点击事件,获取到当前点击的index 根据数组的下标去动态的改变样式。<div class="cross-content"> <div class="cross-state"> <h3>状态筛选</h3> <span @click="checknow(index,'status')" v-for="(it..原创 2022-02-11 14:44:34 · 11515 阅读 · 0 评论 -
引入ant组件分页时显示英文问题
1、在main.js中引入import'ant-design-vue/dist/antd.css'Vue.prototype.zhCN=zhCN2、在APP.vue中写入全局组件这样分页显示的就是中文啦 哈哈哈原创 2021-07-20 10:04:42 · 1118 阅读 · 0 评论