
前端开发
文章平均质量分 73
iMaldway
我很懒,还没留下简介
展开
-
发布你的第一个npm包
在项目中我们会使用到很多npm包,工作时间一长,多多少少会有些技术积累,把一些实用性很高的插件单独作为一个项目开源分享出去,然后打包成npm方便大家使用以及方便自己的维护(项目级)。原创 2022-05-19 15:43:51 · 696 阅读 · 2 评论 -
Vue 全局缓存 字典缓存 节流
在后台管理系统中基本上都会有字典之类的操作。这类操作有一个共性:相同接口、不同参数返回不同的目标数据、数据结构一致。使用上无非是一些下拉选项、多选、状态翻译等。有一个很实际的问题,A页面中存在某个下拉B页面也存在,一般的做法是两次请求,分别获取数据。但是当项目中字典数据应用越来越多的时候,大量重复的请求无法避免,造成资源浪费。实现方案为:当需要的时候进行缓存,再次使用的时候直接取数据,不用再次请求。优点是灵活,按需就取。缺点是,依赖发布订阅模式(Vue中双向绑定),每次都需确认调用。原创 2021-12-30 15:41:33 · 3856 阅读 · 2 评论 -
VUE 自定义 穿梭框
某次项目要使用穿梭框进行数据选择,项目使用的element-ui框架,框架中的穿梭框是这样子的:好像不能满足我的需求,因为需要展示很多内容,包括图片等信息,也要加上很多样式等等,我尝试这去改造,一会后觉得还是自己动手去写一个靠谱。几经鼓捣效果如下:基本上实现了一个穿梭框。以上是展示内容,不包含实际使用。具体可以自定义实现其中的渲染格式。比如上干货<template> <div class="shuttle" :style="{'height':...原创 2021-09-13 11:28:22 · 5465 阅读 · 2 评论 -
JavaScript 浅复制、深复制、面向切面(重构函数)
一个老生常谈的问题,关于JavaScript的浅复制、深复制,这次还带来了面向切面。本文中将会举例来说明这两种区别,最后将会演示面向切面的作用。源代码直接上代码,给出的是一个工具类,就不一一解释代码了,足够演示以及生产使用。/** * 对象操作工具类 * */function Utils() { let __this__ = this; /** * 是否是Object * @param {object} obj * @returns {Boolean} */原创 2021-08-14 10:55:44 · 292 阅读 · 0 评论 -
VUE 枚举(状态)翻译指令/组件
开发由来经常在项目中需要将一些状态类型数据翻译成文字展示给用户。写v-if之类的太过繁琐,要是定义变了那就更麻烦了。所以写了一个枚举(Java后端叫法,通常将一些内容定义到一个枚举类,标识一个状态的所有可能属性内容)翻译指令。所包含的内容一个工具类(EntityUtils.js)。 一个指令(enumeration.js)。枚举工具类(EntityUtils.js)function Utils() { this.STATUS = Object.freeze({ "APP原创 2021-08-07 11:26:41 · 1236 阅读 · 1 评论 -
手把手教你做VUE单页应用SEO优化
前言最近写了个门户网站使用vue做的,不可避免的遇到了SEO方面相关的问题,下面将我采用的解决方案贴出来供大家参考主流的方案1.SSR服务器渲染;2.静态化;3.预渲染prerender-spa-plugin;第一点推荐先去官网了解清楚一下,这里不是使用的这个方案。我的是已经完成的vue应用,再去采用SSR方案就有点不太现实了,如果非要使用SSR的话,建议在着手开发之前,就了解清楚。第二点静态化,直接放弃。手写静态代码太难受了。第三点prerender-spa-plugin...原创 2021-04-07 16:04:08 · 2621 阅读 · 0 评论 -
prerender-spa-plugin 使用以及代理相关
最近使用VUE写了个门户网站,在最后阶段告诉我要做SEO,在网上搜索一番prerender-spa-plugin这个插件蛮好用,再配合sitemap-webpack-plugin与vue-meta-info基本可以满足不想用服务端做SEO的需求了。话不多说直接开干:运行原理安装npm i prerender-spa-plugin配制build目录下webpack.prod.conf.js文件中plugins节点下:new PrerenderSPAPlugin({ .原创 2021-04-07 14:45:25 · 766 阅读 · 3 评论 -
vue-pdf展示base64编码的PDF文件、支持移动端左右滑动、带git仓库demo
最近接到一个需求,要求在前端展示base64编码的PDF文件。刚好前两天使用过vue-pdf插件,想试试能不能行。首先在网上搜了一下,基本上是使用pdf.js去实现的,然后去他官网查看了下,发现引入对新手很不友好,不能直接npm安装。vue-pdf也是基于pdf.js实现的,但是在它的官网中没有标明可以实现展示base64编码的PDF文件。找了一些资料,最后加上了左右滑动切换页面的需求,一起做了个基于 vue-pdf 和 vue-touch 的一个实用实例。 头部展示上一页与下一页还有页码.....原创 2020-10-22 15:36:54 · 3259 阅读 · 4 评论