自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 Echarts-legend自定义

作者内容时间JJEcharts2022年04月20日实现效果图如下html代码 <!-- echarts-pie --> <div class="fd-pie-chart" id="fd-pie-chart"></div> <!-- echarts-legend --> <div class="fd-pie-legend"> <div ...

2022-03-22 00:00:00 4233

原创 vue中使用PDF.js

PDF.js

2022-01-24 08:30:00 12838 8

原创 PDF.js、ztree使用整理

PDF.js相关操作、ztree

2021-12-26 08:30:00 641 4

原创 Vue动态组件

include定义缓存白名单指定哪些需要缓存,keep-alive会缓存命中的组件;exclude定义缓存黑名单指定哪些组件不需要缓存,include和exclude只能用一个 ,被命中的组件将不会被缓存;max定义缓存组件上限,超出上限使用LRU的策略置换缓存数据。

2023-07-22 00:00:00 616

原创 前端取值问题总结

以后在项目中可以根据自己的实际需求选择取整方式以便达到展示准确,合理。

2023-07-20 00:00:00 298

原创 饿了么el-table多级表头斜线效果

通过开发者工具查看before在谷歌浏览器(图7)与ie浏览器(图8)中样式发现before父元素position相对定位没有生效,而在ie浏览器中生效了,这样的导致的结果就是,在谷歌浏览器中,before是相对el-table进行的绝对定位,且脱离了el-table-group th父元素,所以未受父元素overflow:hidden影响。CSS中,::before创建一个伪元素,其将成为匹配选中的元素的第一个子元素。### 5)最终实现效果谷歌浏览器(图10)与ie浏览器(图11)保持样式统一。

2023-06-05 00:00:00 374

原创 vue-devtools手动安装教程

vue-devtools

2023-05-31 00:00:00 431

原创 前端设计规范总结

【推荐】 IDE推荐使用 、 。【强制】 TAB键用四个空格代替。【说明】在不同系统的编辑工具对解析不一样,windows下的键是占空格的位置,而在下会变成占空格的位置。2.2 常用命名约定(HTML, CSS, JS, VUE, PNG, GIF, JPG, ICO)【强制】 命名总是以字母开头。【强制】 和命名一律,必须是英文单词或者汉语拼音,以英语单词优先,多个单词以连字符 ( ) 连接。 只能出现小写英文字母、数字和连字符。文件名中带有清晰含义的元数据,如、、,使用进行区分。

2023-01-31 20:00:00 911

原创 es6之Promise总结

概述Promise 主要是为解决程序异步处理而生的,Promise 接受异步任务并立即执行,然后在任务完成后,将状态标注成最终结果(成功或失败)。Promise 有三种状态:初始化时,刚开始执行主体任务,这时它的初始状态时 pending(进行中)**;**等到任务执行完成,这时根据成功或失败,分别对应状态 fulfilled(成功)和 rejected(失败),这时的状态就固定不能被改变了,即 Promise 状态是不可逆的基本用法Promise 就是一个类,所以使用时,我们照常 new 一个实

2022-06-13 00:00:00 327

原创 es6 async await 使用

概述说一下 async , await 函数的简单应用, 用最简单的示例,让复杂的事变得更简单。记住以下知识,项目中基本够用示例以下示例,大家可以直接复制粘贴到浏览器的console面板测试,方便大家理解。示例1 - 最简单的async 函数// async 关键词,创建的函数就是异步函数async function asyncFn () { console.log('2') return 4;} console.log('1'); asyncFn().then((d

2022-06-08 00:00:00 1355

原创 css个性样式实现

1.设计师钟爱的电池图主要利用linear-gradient<style> .fd-bar-list { width: 400px; color: #849fc1; font-size: 16px; background-color: rgba(5, 27, 74,1); } .fd-bar-bg { width: 100%;

2022-05-14 00:00:00 101

原创 pdf.js切换版本打包以及功能改造

PDF.js版本切换教程1、pdf.js官网(http://mozilla.github.io/pdf.js/)2、pdf.js源码(https://github.com/mozilla/pdf.js)3、版本选择点击 View all tags 如下图选择对应版本zip包下载、解压接下来npm install (注意:node.js版本要控制到10以下,要不gulp会报错,导致打包失败)如遇到node-pre-gyp WARN Using needle for

2022-05-11 11:26:50 2600

原创 vue-router知识点总结

简介1、嵌套的路由/视图表;2、模块化的、基于组件的路由配置;3、路由参数、查询。通配符;4、基于vue.js过滤系统的视图过滤效果;5、细粒度的导航控制;6、带有自动激活的css class的链接;7、HTML5历史模式或hash模式,在ie9中自动降级;8、自定义的滚动条行为 安装(v3.x)安装依赖:npm install [email protected] --save–save:dependencies 键下,发布后还需要依赖的模块,譬如像Echarts库或者Vue框架

2022-04-21 16:33:42 1230

原创 splice()、slice()、split()函数的区分

1.slice(数组)用法:array.slice(start,end)解释:该方法是对数组进行部分截取,并返回一个数组副本;参数start是截取的开始数组索引,end参数等于你要取的最后一个字符的位置值加上1(可选)//如果不传入参数二,那么将从参数一的索引位置开始截取,一直到数组尾var a=[1,2,3,4,5,6];var b=a.slice(0,3); //[1,2,3]var c=a.slice(3); //[4,5,6] //如果两个参数中的任何一个是负.

2022-03-24 00:00:00 118

原创 页面传值方式

一、url传值页面跳转或打开新页面url传值// 在a页面跳转或打开b页面中通过"?"拼接的方式传参// 问号后的参数尽量以对象的形式,方便扩展// 传参之前将参数转换为JSON字符串// 为了防止url中有中文或者其它字符造成不可预期的错误,使用encodeURI和decodeURI对url进行编码var params = {id:‘123’,name:‘xiaowang’}window.location.href = encodeURI(“http://localhost:808

2022-03-23 00:00:00 1527

原创 JS常用数据处理方法

作者内容时间金剑JS常用数据处理方法2022年03月20日一、数据类型基本类型:String、Number、Boolean、Undefined、Null、Symbol、bigInt引用类型:Object、Function基本类型的数据是存放在栈内存中的,而引用类型的数据是存放在堆内存中的1.基本类型var num1 = 5;var num2 = num1;[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-2DV112AP-16...

2022-03-21 00:00:00 3954

原创 字体图标使用教程

作者内容时间JJ字体图标使用教程2022年03月24日字体图标使用教程字体图标打开字体图标网站 https://icomoon.io/(与阿里图标库区别:1.不用账号 2.图标有json文件保。各有优缺点,自行选择)点击 IcoMoon App按钮点击左上角New Empty Set 按钮将准备好的字体图片拖入Untitled Set选择需要生成的字体图标修改字体图标名称也可以设置字体图标前缀与后缀(1、点击设置 2、设...

2022-03-20 08:30:00 285

原创 webpack3升级webpack4所遇问题以及解决方案

作者内容时间JJwebpack3升级webpack42022年03月28日packjson依赖包升级1、 "webpack": "^3.6.0" ---> "^4.44.1"2、 "webpack-dev-server": "^2.9.1" ---> "^3.11.0"3、 增加"webpack-cli": ---> "^3.3.12"(Webpack4之后都需要安装它)4、 "html-webpack-plugin": "^2.30.1" ---...

2022-03-18 15:59:06 1675

原创 垂直居中布局

作者内容时间金剑垂直居中2022年03月30日垂直居中是布局中十分常见的效果之一,为实现良好的兼容性,PC端实现垂直居中的方法一般是通过绝对定位,table-cell,负边距等方法。有了css3,针对移动端的垂直居中就更加多样化。方法1:table-cellhtml结构:<div class="box box1"> <span>垂直居中</span></div>css:.box1{ display: t...

2022-03-14 22:00:00 52

原创 混合开发问题

作者内容时间JJ混合开发问题20220117样式适配问题同一页面,同一元素,展示出左右2中形态(华为mate30pro设备分辨率1176*2400,宽度单位使用的rem)。大家思考下,为什么会有这个问题?引申一下像素分类:设备像素和CSS像素设备像素(device independent pixels): 设备屏幕的物理像素,任何设备的物理像素的数量都是固定的CSS像素(CSS pixels): 又称为逻辑像素,是为web开发者创造的,在CSS和javascr...

2022-01-17 08:30:00 239

原创 WPS使用总结

作者内容时间JJWPS相关问题20210111WPS-windows系统(A6项目建议ActiveX,IE+360兼容模式)1.加载wps控件html(word) <div id="app" style="height:100%;width:100%" v-cloak> <div id="wps" style="height:100%;width:100%" ></div> </div>jsvar ...

2022-01-10 08:30:00 4159 2

原创 Vue.Draggable使用

作者内容时间JJVue-拖拽插件20220103Vue.Draggable    Vue.Draggable是一款基于Sortable.js实现的vue拖拽插件。支持移动设备、拖拽和选择文本、智能滚动,可以在不同列表间拖拽、不依赖jQuery为基础、vue 2过渡动画兼容、支持撤销操作,总之是一款非常优秀的vue拖拽组件。本篇将介绍如何搭建环境及简单的例子,使用起来特别简单对被拖拽元素也没有CSS样式的特殊要求。安装使用1、npm或yarn安装方式:yarn add...

2022-01-03 08:30:00 646

原创 vue搜索关键字高亮

<template> <el-input class="fd-ipt" placeholder="请输入内容" v-model="inputValue" @keyup.enter.native="searchText"> </el-input> <div class="container" v-for="(v, k, i) in htmlContent" :key="i"> ...

2020-05-25 22:04:46 180

原创 jq版本搜索文本关键字高亮

<!DOCTYPE html><html lang=“en”><head><meta charset=“UTF-8”><meta name=“viewport” content=“width=device-width, initial-scale=1.0”><title>Document</title><style>.highlight {color: red;}</style>

2020-05-25 21:20:57 403

空空如也

空空如也

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

TA关注的人

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