- 博客(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
4468
原创 Vue动态组件
include定义缓存白名单指定哪些需要缓存,keep-alive会缓存命中的组件;exclude定义缓存黑名单指定哪些组件不需要缓存,include和exclude只能用一个 ,被命中的组件将不会被缓存;max定义缓存组件上限,超出上限使用LRU的策略置换缓存数据。
2023-07-22 00:00:00
667
原创 饿了么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
559
原创 前端设计规范总结
【推荐】 IDE推荐使用 、 。【强制】 TAB键用四个空格代替。【说明】在不同系统的编辑工具对解析不一样,windows下的键是占空格的位置,而在下会变成占空格的位置。2.2 常用命名约定(HTML, CSS, JS, VUE, PNG, GIF, JPG, ICO)【强制】 命名总是以字母开头。【强制】 和命名一律,必须是英文单词或者汉语拼音,以英语单词优先,多个单词以连字符 ( ) 连接。 只能出现小写英文字母、数字和连字符。文件名中带有清晰含义的元数据,如、、,使用进行区分。
2023-01-31 20:00:00
1162
原创 es6之Promise总结
概述Promise 主要是为解决程序异步处理而生的,Promise 接受异步任务并立即执行,然后在任务完成后,将状态标注成最终结果(成功或失败)。Promise 有三种状态:初始化时,刚开始执行主体任务,这时它的初始状态时 pending(进行中)**;**等到任务执行完成,这时根据成功或失败,分别对应状态 fulfilled(成功)和 rejected(失败),这时的状态就固定不能被改变了,即 Promise 状态是不可逆的基本用法Promise 就是一个类,所以使用时,我们照常 new 一个实
2022-06-13 00:00:00
426
原创 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
1529
原创 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
134
原创 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
4151
原创 vue-router知识点总结
简介1、嵌套的路由/视图表;2、模块化的、基于组件的路由配置;3、路由参数、查询。通配符;4、基于vue.js过滤系统的视图过滤效果;5、细粒度的导航控制;6、带有自动激活的css class的链接;7、HTML5历史模式或hash模式,在ie9中自动降级;8、自定义的滚动条行为 安装(v3.x)安装依赖:npm install vue-router@3.0.1 --save–save:dependencies 键下,发布后还需要依赖的模块,譬如像Echarts库或者Vue框架
2022-04-21 16:33:42
1326
原创 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
149
原创 页面传值方式
一、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
1660
原创 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
4117
原创 字体图标使用教程
作者内容时间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
332
原创 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
1919
原创 垂直居中布局
作者内容时间金剑垂直居中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
78
原创 混合开发问题
作者内容时间JJ混合开发问题20220117样式适配问题同一页面,同一元素,展示出左右2中形态(华为mate30pro设备分辨率1176*2400,宽度单位使用的rem)。大家思考下,为什么会有这个问题?引申一下像素分类:设备像素和CSS像素设备像素(device independent pixels): 设备屏幕的物理像素,任何设备的物理像素的数量都是固定的CSS像素(CSS pixels): 又称为逻辑像素,是为web开发者创造的,在CSS和javascr...
2022-01-17 08:30:00
287
原创 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
4854
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
741
原创 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
212
原创 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
477
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人