![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
web前端开发
shengsaihong
这个作者很懒,什么都没留下…
展开
-
vue html生成pdf
一、安装依赖1、npm install jspdf2、npm install html2canvas二、页面引入import html2Canvas from "html2canvas";import jsPDF from "jspdf";三、导出pdfhtmltopdf() { // let tempNode = document.createElement('div'); // tempNode.innerHTML = doc原创 2022-04-22 13:22:04 · 1919 阅读 · 0 评论 -
vue html导出word文档
一、安装依赖npm install file-savermethods: { handleExport() { const html = this.getHtmlContent(); var FileSaver = require("file-saver"); let blob = new Blob([html], { type: "text/html;charset=utf-8" }); FileSaver.saveAs(原创 2021-07-29 17:37:55 · 550 阅读 · 0 评论 -
vue利用word模板导出word文档
一、安装依赖1、npm install docxtemplater2、npm install pizzip3、npm install jszip-utils4、npm install file-saver二、在页面引入import docxtemplater from 'docxtemplater';import PizZip from 'pizzip';import JSZipUtils from 'jszip-utils';import { saveAs } from '原创 2021-07-29 17:28:58 · 996 阅读 · 1 评论 -
vue兼容低版本浏览器
1、babel-polyfillnpm install --save babel-polyfill在main.js 头部引入import "babel-polyfill";2、引入babel-polyfill后,有时编译还会报错:Block-scoped declarations (let, const, function, class) not yet supported outside strict mode基本上是vue引入了第三方插件包含es6语法,但没有配置采用babel-l.原创 2021-07-09 14:25:11 · 1765 阅读 · 0 评论 -
vue作用域插槽
首先,在 2.6.0 中,我们为具名插槽和作用域插槽引入了一个新的统一的语法 (即v-slot指令)。它取代了slot和slot-scope这两个目前已被废弃但未被移除且仍在文档中的 attribute。匿名插槽,具名插槽都好理解,作用域插槽看了文档,感觉还是有点晕,记录下。大概就是使用作用域插槽,父组件可以拿到子组件的数据并渲染。为了让user在父级的插槽内容中可用,子组件可以将user在slot标签上绑定属性值,如:<slot :user="'username'"...原创 2021-02-05 18:02:40 · 85 阅读 · 0 评论 -
路由跳转后,setInterval没有销毁
最近项目碰到需要实时刷新数据的问题,使用了setInterval实现,发现路由跳转之后,组件被销毁了,但是setInterval还没有销毁,还在继续后台调用,如果运行量大的话,会导致严重的页面卡顿。解决办法:在组件生命周期beforeDestroy中清除定时器beforeDestroy(){ clearInterval(this.timer)}但是在路由包含在keep-alive里的时候,beforeDestroy()不会执行...原创 2021-01-13 16:08:03 · 912 阅读 · 0 评论 -
小程序new Date(date)的兼容性
小程序 new Date(2019-09-04 00:00:00) 返回对象nullIOS系统不支持2019-09-04这样的格式。解决办法:用正则替换2019-09-04日期格式为2019/09/04.letolddata ='2019-09-0400:00:00';let newDate =olddata .replace(/-/g, '/');return ne...原创 2019-09-04 09:08:43 · 495 阅读 · 0 评论 -
移动端适配
使用动态rem实现移动端的适配。<script> var pageWidth = window.innerWidth document.write('<style>html{font-size:' + pageWidth + 'px;}</style>')</script>加入这段js代码,根元素html的font-siz...原创 2019-07-05 17:44:46 · 96 阅读 · 0 评论 -
前端性能优化
1、减少HTTP请求。 一个完整的请求都需要经过 DNS寻址、与服务器建立连接、发送数据、等待服务器响应、接收数据这样一个 “漫长” 而复杂的过程。请求数多了,占用的带宽也多(每个请求都需要携带数据),请求速度会变慢,影响用户体验。 (1)合理设置 HTTP缓存。(2)CSS Sprites或使用字体图标代替(3)图片懒加载(先加载第一屏内容)...原创 2019-07-04 17:18:57 · 112 阅读 · 0 评论 -
移动端css公共样式
html { font-size : 20px; } @media only screen and (min-width: 401px){ html { font-size: 25px !important; } } @media only screen and (min-width: 428p...原创 2019-04-29 08:44:34 · 962 阅读 · 0 评论 -
miniGrid:轻量级流布局JS插件
流布局我想不少用户知道,这些布局前端代码比较复杂,一般是用插件来完成,今天我们分享的miniGrid.js也是流布局插件之一,特色是非常轻量级,大小只有2KB,下面来看看介绍。演示:minigrid 和其它流布局差不多,窗口缩小时会有动画滑动,当然用户也可以去取消这个动画。教程:Step 1: 引入外部文件为你的网页嵌入对应的JS文件,这里我们只加入<body> ... 内容 ....转载 2018-07-12 15:54:26 · 2104 阅读 · 0 评论 -
h5页面 在安卓手机端软键盘弹出顶起页面布局的解决办法
如果是footer被顶起,用js判断var oHeight = $(document).height(); $(window).resize(function(){ if($(document).height() < oHeight){ $("#footer").css("position","static"); }else{...原创 2018-06-13 16:52:14 · 19528 阅读 · 0 评论 -
微信下载app
h5下载app原创 2017-09-13 13:19:10 · 714 阅读 · 0 评论 -
js实现HTML转换成图片
html2image原创 2017-08-10 14:31:24 · 24562 阅读 · 6 评论