随笔分类 - 前端
摘要：文件不能直接设置为 img 元素的 src 属性值。要展示 file 文件，需要在 img 属性中使用 JavaScript 来实现，可以参考以下代码： html页面代码： <input type="file" id="photoInput" accept=".jpg, .jpeg, .png" m
阅读全文
摘要：1、安装html2canvas和jspdf npm install html2canvas npm install jspdf 2、新建文件htmlToPdf.ts // 导出页面为PDF格式 import html2Canvas from 'html2canvas' import JsPDF fr
阅读全文
摘要：需求：我有一个页面，是由多个模块组成的，现在我需要把页面转为pdf并下载，但是因为pdf自动换页以后会把我的模块给截开，不好看甚至内容被裁开，所以我需要判断当前页面加上这个模块以后是不是会超出当前页，如果超出，就直接把整个模块换到第二页去显示。 页面大致如下： 页面代码大致如下： <template
阅读全文
摘要：最近写了个页面，想到了用瀑布流实现页面布局。在我看来一个合格的横向瀑布流式布局包含以下几个条件： 1、每个内容块高度可以不等，但宽度相等。 由于内容的不确定性，内容块的高度应根据内容高度伸缩。高度相等的话就变成了网格布局，规整倒是规整，不仅没有瀑布效果，内容的个性也无从体现。 2、内容块应进行横向排
阅读全文
摘要：1.安装插件 在vscode界面左侧，点击图中所示的菜单项，搜索Vscode counter 2.使用插件统计代码 2.1.点击顶部 View 菜单 2.2.在下拉选项中选择第一项 Command Palette（ctrl+shift+p） 2.3.工作区选择VscodeCounter:Count
阅读全文
摘要：vue： methods: { //返回按钮指定到首页去 goBack() { this.$router.push({ path: "/" }); }, }, //页面销毁时，取消监听 destroyed() { window.removeEventListener("popstate", this
阅读全文
摘要：例如我们当前有a、b两个数组，想要知道两个数组当前的差异，就需要知道这两个数组的差集。 谁与谁的差集，可以理解为，我有，但是你没有的。 比如a=[1,2,3] b=[2,4,6] 这时候a与b的差集就为[1,3]，b与a的差集为[4,6]。 下面我们可以通过一个简单的js来获取差集 //求差 fun
阅读全文
摘要：在侧边菜单太多时，会出现展示不完全，但是又不能滚动的情况，如果加了overflow-y:auto以后呢，旁边的滚动条又不好看，这个时候就可以通过简单的设置隐藏掉滚动条 需要隐藏滚动条的div <div id="div-nav"> <systemNavMenu :isSwitch="isSwitch"
阅读全文
摘要：原先用的 white-space: break-spaces; 来控制文本换行，但是发现这样对部分手机不起作用，然后就把样式换成如下： word-break: break-all; word-wrap: break-word; white-space: pre-wrap; 经测试有效
阅读全文
摘要：<!--region 封装table--> <template> <div class="table"> <el-table id="iTable" :data="data" ref="mutipleTable" @selection-change="handleSelectionChange" v
阅读全文
摘要：//下载文件 function downLoad(url) { var xhr = new XMLHttpRequest(); xhr.open("get", url, true); xhr.responseType = "blob"; xhr.onload = function () { var
阅读全文
摘要：简介 filter()方法会创建一个新数组，原数组的每个元素传入回调函数中，回调函数中有return返回值，若返回值为true，这个元素保存到新数组中；若返回值为false，则该元素不保存到新数组中；原数组不发生改变。 语法 array.filter(function(currentValue,in
阅读全文
摘要：如图完成左右布局，其实两个设置就能搞定 1、父级div定义display为flex 2、需布局在右边的div如下图设置
阅读全文
摘要：区别 localStorage: localStorage 的生命周期是永久的，关闭页面或浏览器之后 localStorage 中的数据也不会消失。localStorage 除非主动删除数据，否则数据永远不会消失 sessionStorage: sessionStorage 的生命周期是仅在当前会话
阅读全文
摘要：刚接触的时候，分不清draggable和droppable的区别，瞎弄了一会，其实很简单，draggable就是“拖”的功能，droppable就是“放”的功能。 一、先上一个简单例子 1、代码 2、截图/ 拖动 #draggable之前的截图 把#draggable 丢到 #droppable 之
阅读全文
摘要：一、设置描述 1.VSCode作为一款很不错的开发软件，相比DW更小巧，用来测试前端特别不错，那么我们平时开发网页发现只有写完代码，然后保存，接下来到浏览器中刷新查看效果，然后不停重复，我们发现很多时间就这样浪费到了这三个步骤上。 2.其实我们可以在VSCode中配置一个网页服务器，修改完代码之后只
阅读全文
摘要：命令 ionic cordova resources ionic cordova resources --icon ionic cordova resources --splash 准备 准备一张大小为1024*1024的图片文件作为APP的图标（命名：icon） 准备一张大小为2732 * 273
阅读全文
摘要：1.认识ionic的生命周期钩子 截至ionic 3.8.0版本，框架提供了8个钩子函数，它们分别会在页面生命周期的各个阶段被触发，我们来简单了解一下。 1.1 ionViewDidLoad 页面加载完成触发，这里的“加载完成”指的是页面所需的资源已经加载完成，但还没进入这个页面的状态（用户看到的还
阅读全文
摘要：这种是videogular2 跟ionic版本兼容问题 换个videogular2版本试试 把原来版本去掉 自己手动安装 npm install videogular2@6.1.0 --save
阅读全文
摘要：// 声明变量 applicationInterval:any; // 定时器 // 使用定时器，每秒执行一次 ionViewDidEnter(){ let that = this; let applicationPageOpenData:number = parseInt(((new Date()
阅读全文
浙公网安备 33010602011771号