- 博客(36)
- 收藏
- 关注
RSS订阅原创 js树形数据递归转化至list生成id和parentId，和再次递归成树时产生的内存泄漏触发浏览器断点保护
在项目交付时，甲方系统接入我们的子系统，甲方希望对菜单权限进行统一控制，而不是在子系统内控制，所以需要对甲方系统树形格式的菜单数据进行扁平化处理，再匹配添加我们子系统的菜单数据字段，这样已经写好的代码就不需要再改动了。处理时遇到的问题，将树形数据处理为list遇到的问题：treeToList(tree,pId){ let node = {menuId:this.numId ,menu:tree[i].menu,pId:pId} this,menuList.push(node) if(tree[i]
2021-01-23 14:44:17
900
原创 前端通过文件流导入导出excel（兼容IE）
前端通过文件流导入导出excel（兼容IE）api文件夹内新建config.js，封装导入导出的请求方法import axios from 'axios'.../** 上传* url:请求地址* params:参数* */export function fileUpload(url, params = {},loading=true) { return new Promise((resolve, reject) => { service({
2020-12-30 12:54:05
761
原创 [Vue warn]: Invalid handler for event “click“: got undefined报错原因
今天在写菜单的时候，vue中我将onClick事件写到了rander函数里渲染的方式，渲染的是菜单，有些具有children的菜单也需要点击跳转这个需求，这样写了之后，点击跳转的功能生效了，但是会报vue警告。Invalid handler for event “click”: got undefined解决： 把点击事件的方法写道methods方法里...
2020-10-25 15:31:35
2900
原创 前端json格式请求文件流导出excel文件
前端json格式请求文件流导出excel文件 ：请求方法：// http为axios封装后的方法export function exportFile(url,data){http.post(url,data,{ headers: { 'Content-type' : 'application/json;charset-UTF-8', // 设置content-type 'Authorization' : sessionStorage.getItem('sessionId') // 获取
2020-09-02 10:27:36
826
原创 根据传入字符，递归获取任意层级结构数据中对应节点属性值。
后台给的树形层级结构，回显根据id获取名称name/***❤**根据传入字符，递归获取任意层级结构数据中对应节点属性值。(层级结构数据最外层为[]或{}均可)@onlyCode = 传入字符@treeData = 树形结构数据@code = 节点编码id，不传默认为value@name = 节点名称name，不传默认为label@childName = 内嵌数组对象集的属性名称，不传默认为children*/ const getNameFormTree = (onlyCode, tree
2020-09-02 09:49:23
345
1
原创 el-cascader联级选择器在v-for循环中获取节点对象的正确使用姿势
el-cascader在v-for中使用refs.xxx.getCheckedNodes()会报getCheckedNodes is not a function ，研究了很久，终于搞出了正确姿势：//v-for循环时要有item和index ，将index传入el-cascader的change事件：<el-row v-for(item,i) in orgList :key="index"><el-cascader ref="tree" @change = "checkedCh.
2020-08-04 00:07:25
2007
1
原创 关于element中联级选择器el-cascader单选，选中复选框联级模态框立即消失
如图，此联级选择器设置为单选，所以用户点击左侧单选框选中后，需要点击其他空白地方才选择框能消失，如果联级选择器在较小的dialog弹窗的表单中，点击其他地方，弹窗和选择器都直接消失了，用户体验非常的不友好，如果是单选的话，所以一旦选中的话，界面就没有必要显示了。想要实现选中立即隐藏这里可以使用this.$refs.[“联级选择器的ref值”].dropDownVisble = false,代码如下：//el-cascader的change事件,saveOrgTree是联级组件的refcheckedCh.
2020-08-03 23:51:15
2046
1
原创 el-select可搜索功能，实现对输入的搜索内容进行控制
今天测试提了一个bug，需求是一个下拉框，带搜索过滤功能，测试要求对输入的内容进行控制，控制其长度为20，搜索功能是不进行交互的，是前端的一个功能而已，测试要求，那就搞呗。可以用.native获取内部input<el-selectv-model="searchForm.productId"placehoder="请输选择产品或输入产品名字过滤"filterable@input.native="filterData"clearableref="searchSelect"><
2020-07-25 10:04:28
7608
5
原创 前端下载文件，值得借鉴
https://www.cnblogs.com/willingtolove/p/10686208.html#_label7_0
2020-05-30 15:38:31
186
原创 前端真实面试场景
今天的一个视频面试，这里写下问到的一些有印象的问题，其实还有遗漏的但是打得不好的都在这里了（公司CEO、技术、HR同时视频，HR做记录）：自我介绍完首先是搞技术的高管问：1.app首页加载缓存的问题怎么解决？我：只答了一个keep-alive，面试官说这点还有很多可以聊2. 苹果X手机的输入框，input 输入聚焦时候，input框会下滑道下面，虚拟键盘会挡住input,无法看到输入的内容...
2020-03-06 23:46:07
1671
原创 VUE各个组件的传值
VUE各个组件的传值父给子传值父组件可以 引入、使用 子组件，从业务上看，该父组件有可能对子组件有个性化需求，为了体现组件的灵活多变，可以通过传值实现语法：父组件要在子组件标签上通过属性值方式传值<子组件标签 name=value name=value name=value></子组件标签>子组件接收并应用值，具体通过props接收<!--在模板中应...
2020-02-03 21:14:21
193
原创 使用JS控制元素的伪元素
一. 缘由：本文源于在OSC社区中，有人提问如何用jq获取伪元素。我第一想法是强大的CSS Query应该可以获取伪元素吧。然而事实上，CSS Query并不能。即我们不能通过(“:before”)、(“:before”)、(“:before”)、(dom).find(“:before”)或document.querySelector(“:before”)来获取:before伪元素。为此，我...
2019-12-29 22:03:25
580
原创 Ajax 04 ajax全局处理器跨域请求 | JSONP的跨域实现原理|节流防抖优化|HTTP协议
jQuery的全局ajax处理器作用：用来对页面中的ajax操作进行统一设置，简化操作常见场景：加载资源的loading功能ajaxStart() 任意请求开始时触发内部回调写法：$(document).ajaxStart(function () { // 代码...});ajaxStop() 任意请求结束后触发内部回调写法：$(document).aj...
2019-12-28 23:36:47
231
原创 Ajax 03.原生Ajax使用|FormData的使用
原生Ajax使用XMLHttpRequest的基本使用简称xhr步骤:1.创建xhr对象var xhr = new XMLHttpRequest();调用xhr.open()函数如果希望设置get请求的请求参数,需要放置在open()参数2地址的最后位置书写格式为:地址?名=值&名=值&…xhr.open('GET','http://www.liulong...
2019-12-28 23:33:24
1132
原创 前端开发常见面试问题(二)
C3的动画和jQuery动画的区别css3 animation与jQuery animate()区别在于实现机制不同:1.css3中的过渡和animation动画都是基于css实现机制的，属于css范畴之内，并没有涉及到任何语言操作。效率略高与jQuery中的animate()函数，但兼容性很差。2.jQuery中的animate()函数可以简单的理解为css样式的“逐帧动画”，是css样式...
2019-12-24 22:48:27
192
原创 JavaScript 常见报错解析
js开发中遇到一些常见的报错信息Uncaught TypeError: undefined is not a function错误类型为TypeError（类型错误）;错误产生：你希望调用一个函数，这个值却不是一个函数。错误修复：确保函数名正确。这个错误中，错误行号能正确指示。Uncaught ReferenceError: Invalid left-hand side in assig...
2019-12-16 21:39:54
1185
原创 前端开发常见面试提问(一)
1、CSS3 新特性有哪些？1. 颜色：新增 RGBA，HSLA 模式2. 文字阴影（text-shadow）3.边框： 圆角（border-radius） 边框阴影： box-shadow4. 盒子模型：box-sizing5.背景：background-size 设置背景图片的尺寸 background-origin 设置背景图片的 原点 background-clip 设置背...
2019-12-16 21:38:03
551
原创 Ajax02 表单和ajax结合使用|模板引擎便捷展示
表单简介表单的组成部分form标签容器表单域：input 标签，textarea。。select、、提交按钮：<input type = “submit”><button type = “submit”>提交</button>表单操作的特点：提交数据时会出现跳转的情况form标签的属性action targ...
2019-12-13 10:28:52
164
原创 Ajax 01客户端和服务器 | jQuery中的ajax | 服务端接口
Ajax -网络编程客户端和服务器的基本概念上网的目的获取和消费（使用）资源客户端和服务器（服务端）客户端：使用服务的计算机如果一台计算机希望成为客户端，必须安装浏览器服务端：提供服务的计算机如果一台计算机希望成为服务端，必须安装特定的服务端软件服务器负责存放和对外提供资源的电脑，叫做服务器。URL地址URL中文叫统一资源定位符，用于标...
2019-12-10 18:39:08
317
原创 JavaScript：函数进阶 函数闭包
字符串方法：var str = ' abcdedf ';console.log(str.trim());//去除字符串两侧的空格符函数进阶函数的定义//1.命名函数function fn (){ }//2.匿名函数 变量接收var fn = function(){ } fn()//3.自调用函数(function(){ })() //4.创建对象var fn...
2019-12-09 22:56:10
376
原创 JavaScript：构造函数
构造函数在构造函数本身上添加的成员是静态成员，只能由构造函数本身来访问（）构造函数内部创建的对象成员称为实例成员，只能由实例化的对象来访问（new 来访问）构造函数原型 prototype构造函数原型是构造函数的属性，这个属性是一个对象，也称prototype为原型对象Star.prototype 是一个对象作用：是为了共享方法，从而达到节省内存空间的目的注意：每一个函数...
2019-12-09 22:54:30
230
原创 JavaScript面向对象
JavaScript面向对象1.1两大编程思想：1、面向过程面向过程：POP(Process-oriented programming)面向过程就是分析出解决问题所需要的步骤，然后用函数把这些步骤一步一步实现，使用的时候再一个一个的依次调用就可以了。大象放到冰箱：打开冰箱==》放入大象==》关上冰箱2、面向对象面向对象：OOP (Object Oriented Programming...
2019-12-04 23:03:04
137
原创 jQuery learn 03
事件处理 on（）绑定事件elm.click（）2.on（“事件类型”，fn（事件处理程序）） 优势1：同时绑定多个事件$("#input").on({ click ：function(){}, mouseover ：function(){}, mouseout ：function(){},})多个事件类型，处理函数一样：$("#input")...
2019-12-04 00:15:00
127
原创 jQuery learn 02
jQuery动画效果显示隐藏效果show([speed,[easing],[fn]])【显示】hide([speed,[easing],[fn]])【隐藏】toggle([speed,[easing],[fn]])【切换】（1）参数都可以省略， 无动画直接显示。（2）speed：三种预定速度之一的字符串(“slow”,“normal”, or “fast”)或表示动画时长的毫秒数值...
2019-12-04 00:14:12
126
原创 jQuery learn 01
jQuery概念：jQuery 是一个快速、简洁的 JavaScript 库 JavaScript库：即 library，是一个封装好的特定的集合（方法和函数）。 学习jQuery本质： 就是学习调用这些函数（方法）。【方法()】简单理解： 就是一个JS 文件，里面对我们原生js代码进行了封装，存放到里面。这样我们可以快速高效的使用这些封装好的功能了。其设计的宗旨是“write L...
2019-12-04 00:11:42
225
原创 JS基础学习易遗忘知识点笔记||疑难点||(二): 内置对象,遍历数组；操作数组
变量与函数声明同名a,预解析后,函数优先,如果下面给a赋值,那么内置对象//求一堆数中的最大值:Math.max(一堆数);//求一个数的绝对值 正数Math.abs(x) ;//得到当前时间的日期对象var date = new Date();获取从1970年1月1日到现在的总毫秒数，常说的时间戳var date = new Date();console.log(d...
2019-11-28 00:08:03
135
原创 setInterval里调用函数后setInterval只执行一次的原因和解决办法
今天用原生js写一个打飞机的小demo的时候发现的，之前可能遇到过到时一直也没有写下原因。下面是我的代码： // 随机降落目标封装 function dr() { var foe = document.createElement("div") foe.setAttribute("class", "foe") foe.style.le...
2019-11-27 23:58:57
1121
原创 Web API学习笔记(二) DOM获取css选择器 ，事件注册
1.获取元素对象 选择器[!!!]语法:可以使用CSS选择器;document.querySelector(‘CSS选择器’)document.querySelector("#box");document.querySelector(".father");//只返回一个//没有找到返回 null document.querySelectorAll(‘CSS选择器’)d...
2019-11-25 12:04:59
262
原创 响应式布局
day 5 响应式布局一份代码相应不同终端响应原理各个档位下的版心 container市场约定档位划分:w<768 超小屏幕（xs : extra small）（手机，学习rem布局里面的档位划分都是在这个范围）768<= w <992 小屏设备（sm : small）（平板）992<= w <1200 中等屏幕（md: medium）（桌面...
2019-11-19 23:40:32
145
原创 Web API学习笔记(一)各种获取文档对象的方法/注册事件(代码多注释)
Web API应用编程接口JavaScript组成ECAMAScript:js的语法规范;简称ES;DOM-document object model-文档对象模型-把整个页面看成一个对象;BOM - browser object model-浏览器对象模型:把浏览器看成一个对象;DOM在js里标body每个签被称为节点,也叫DOM节点我们现在认知的节点包括:标签...
2019-11-18 23:09:20
255
原创 JS基础学习知识点浓缩笔记||疑难点||采坑点(一): 数据类型和运算符
简单数据类型1.Number类型所有数字都是number类型NaN:not a number,不是某个数,泛指2.String 类型:字符串两边带单双引号,转意字符:var info = ‘我说:“xxxx”;他说:“ssss”’3.boolean类型:对错作用:描述一件事对或者错?存在/确定?var a = true;var b = false;4....
2019-11-18 23:01:14
128
原创 js 数组收集0到任意正整数之间的质数
分析: 质数,不能被1和自身之外的任何数整除; 那么a除以大于2又比他小的数不等于0;for (var a = 2; a <= 100; a++) { var b = 2; while (a % b != 0) { b++; } if (a == b) { document....
2019-11-12 23:57:03
387
原创 用CSS写一个简单的3D立方体动画
1.思路先准备一个盒子写相等的宽高，里面放六个相同子盒子标签，宽高都和父元素相等，然后同时将六个子元素定位，再通过3d旋转+位移使六个子元素到达指定位置，成为立方体的六个面，定义动画使其运动起来2.步骤1.写好父元素和六个子元素并定义宽高和位置 <div class="p"> <div>1</div> &...
2019-11-09 00:31:57
368
原创 CSS:仅对子盒子修饰样式，三种让其在父盒子中水平垂直居中的方法及其优缺点(父盒子宽高未知)
1.给父盒子相对定位,子盒子绝对定位,left,top,right和bottom,都设置为0:position: absolute;left: 0;right: 0;top: 0;bottom: 0;margin: auto;优点:简单无脑,不用计算;缺点:不能微调位置2.给父盒子相对定位,子盒子绝对定位,left: 50%;top: 50%;margin-left: 负的宽度一半...
2019-11-02 22:21:25
374
原创 css-实现鼠标移至图片上显示黑色半透明遮罩层，且不至于遮住图片上的超链接的方法
作为一个刚接触html和css的小白,总会遇到一些细节问题,在这里写下一个我遇到的小问题的解决方法,方便今后加深理解,更高效地学习。一般情况下，让一个图片有超链接，可以用a标签把 img包住，但是要做hover鼠标经过显示黑色半透明遮罩层如果用定位的话，定位的半透明遮罩层就会把图片遮住，以至于鼠标经过没有小手指，也点不到链接，所以这里给出一个思路，可以让a链接和图片同为子元素，然后display...
2019-10-31 17:40:56
5840
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人