前端
昵称已存在lxttttt
这个作者很懒,什么都没留下…
展开
-
JavaScript函数扁平化
function fn1(x) { return x + 10}function fn2(x) { return x * 3}function fn3(x) { return x % 10}console.log(fn3(fn2(fn1(5)))) // 5// 函数扁平化function compose(...funcs) { // funcs:传递的函数(type: function) return function proxy(...args) { // args:原创 2022-01-25 15:41:09 · 614 阅读 · 0 评论 -
JavaScript数组扁平化
使用reduce实现数组扁平化js的两个操作数组方法:reduce, concatconst arr = [[1, 2, [3, 4, [5], [6, 7]], [8]], 9, [10]]// to => [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]function flatter(arr) { return arr.reduce((preNum, curNum) => { return preNum.concat(Array.isArray(c原创 2022-01-25 14:51:50 · 428 阅读 · 0 评论 -
element table动态表头数据刷新后表格高度变化,el-table__body-wrapper is-scrolling-left元素高度计算错误
在使用element table时,header数据会根据页面数据发生变化,这个时候会发现刷新数据后页面表格高度发生变化,会短一截。这是element ui框架自身的问题。打开控制台会发现浏览器自动加了一个高度样式,一般来说element style加的样式可以通过给页面样式添加!important进行覆盖,但elementUI中的样式找不到应该修改的地方可以给当前页面的table上添加一个class,通过样式穿透+!important的方式更改高度.el-table__body-wrapper是原创 2021-11-26 14:47:13 · 3307 阅读 · 1 评论 -
element UI对el-dropdown的二次封装(三级下拉框)
<template> <el-dropdown trigger="click" :hide-on-click="true"> <el-button> <svg-icon :icon-class="iconClass" class-name="icon-svg" /> <span>{{ text }}</span> <i class="el-原创 2021-11-09 17:50:32 · 1161 阅读 · 0 评论 -
在render中渲染el-dropdown
模板结构为<el-dropdown> <el-button> <svg-icon icon-class="filter" class-name="icon-svg" /> <span>筛选</span> <i class="el-icon-arrow-down el-icon--right" /> </el-button> <el-dropdown-menu slot="dropdown">原创 2021-11-04 16:21:02 · 1006 阅读 · 0 评论 -
vuex的基本使用
State用于存储全局变量state: { count: 0}获取state的方式:this.$store.state.countMutations只能通过Mutations变更state中的值,不可以直接操作state中的数据。Mutations会对state中的数据进行集中监听mutations: { addCount(count) { state.count++ }}组件触发mutations的方式:this.$store.commit('addCount')原创 2021-11-03 15:43:57 · 52 阅读 · 0 评论 -
js将表格转换成树表
参考:https://www.cnblogs.com/loveshes/p/11877799.html原表格结构转换成这样的结构代码:arr2tree2(arr, root) { var temp = {} temp[root.id] = root for (var i = 0; i < arr.length; i++) { // 插入一个新节点,后面对该节点的修改都会同步到该节点的父节点上 temp[arr[i].id]原创 2021-10-21 10:34:59 · 168 阅读 · 0 评论 -
js文件结构,通过指定id查找路径
文件结构如下所示控制台打印输出代码:getPathById(value, arr) { const tempPath = [] try { for (let i = 0; i < arr.length; i++) { this.getNodePath(arr[i], tempPath, value) } } catch (e) { return tempPath }},getNodePath(node, tempPath, value)原创 2021-10-20 14:30:37 · 220 阅读 · 0 评论 -
elementUI在vue中使用时css样式不生效
根据官方提示先是使用npm i element-ui -S对element-ui进行了安装,并按照官方提示对整个Element进行引入,但在测试element-ui中淡入淡出动画时发现按照官方写法无法出现正确的结果:可以看到,图中的按钮样式不对,而且点击按钮后也没有出现内置过渡动画冲洗阅读文档后发现了这么一段话:这说明在我使用npm i element-ui -S时只是引入了js文件,而css文件需要单独引入解决办法:找到项目的index.html文件,通过CDN的方式引入css文件引入后实原创 2021-07-30 10:57:12 · 1431 阅读 · 2 评论 -
常用的webpack打包loader
file-loader: 将文件输出到一个文件夹中,通过相对url去引用输出的文件url-loader: 当文件大小小于设置的limit时以base64的形式将文件注入到代码中image-loader: 加载并压缩图片文件babel-loader: 将ES6转换成ES5css-loader: 使css模块化style-loader: 将css文件注入到js中...原创 2021-05-15 00:19:47 · 40 阅读 · 0 评论 -
在前端模块化中ES6与CommonJS的区别
。原创 2021-05-15 00:14:19 · 128 阅读 · 0 评论 -
js数据类型转换
JavaScript的几种基本数据类型有:String, number, boolean, object, function, symbol, null, undefined对象类型有:Object, Date, Array对js数据类型进行转换的方法有:String(x) 将x转换为字符串number.toString() 将数据转换为字符串(可以用+)true.toString() , false.toString() 将布尔值转换为字符串Number(string) 将字符串stri原创 2021-04-30 14:37:35 · 38 阅读 · 0 评论 -
vue生命周期
vue的生命周期分为以下几个部分beforeCreate ->初始化事件和生命周期created ->初始化data和methodsbefroeMount ->完成模板实例化mounted ->渲染数据到页面上beforeUpdate ->更新Model层的dataupdate ->更新View层的databeforeDestroy ->进入销毁状态destroyed ->销毁掉组件中的数据、过滤器、函数、指令等图示如下:原创 2021-04-23 23:02:38 · 145 阅读 · 0 评论 -
数组去重
let arr = [23,6,9,8,8,5,23,0,1,9]; console.log(arr); // js最简单方法 function unique1(array) { var arr = []; for(var i = 0; i < array.length; i++) { // arr中不存在该元素 if (arr.indexOf(array[i]) == -1) { ...原创 2021-04-10 09:56:04 · 44 阅读 · 0 评论 -
前端判断数据类型的方法及优缺点
使用typeof判断数据类型使用方法:typeof(123); // numbertypeof('123'); // stringtypeof({}); // objecttypeof([]); // object主要用于检测基本数据类型优点:代码量少,区分基本的数据类型缺点:引用类型无法区分,全部表示为object基本数据类型:Number, String, Boolean, Null, undefined, object, symbol, bigInt引用数据类型:fun原创 2021-03-30 17:23:18 · 316 阅读 · 0 评论 -
前端面试总结
如何判断当前页面是Web端还是手机端如何使各种小程序在各个平台兼容如何判断用户输入的密码是否符合密码要求正则表达式如何使Web前端在各个浏览器兼容如何使浏览器加载一个很长的图片DOM...原创 2021-03-22 19:15:26 · 58 阅读 · 0 评论 -
前端笔试总结
列出CSS中可以继承的属性1.字体系列属性font-family font-weight font-size font-style2.文本系列属性text-indent text-align line-height word-spacingletter-spacing text-transform3.元素可见性visibility4.列表布局属性list-style5.光标属性cursorJS的集中主要的数据类型Number String Object原创 2021-03-11 17:48:00 · 74 阅读 · 0 评论 -
AngularJS(一)
AngularJS使用在标签下面添加<script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js"></script>指令含义ng-app="" 定义AngularJS的使用范围ng-init="变量=值;变量=值" 初始化变量的值,有多个变量时用分号隔开ng-model="变量" 定义变量名ng-bind="变量" 绑定变量名,获取该变量的数据,使用双重花括号{{变量}}获取变原创 2021-03-03 17:01:45 · 169 阅读 · 2 评论 -
前端vue+分页
直接贴代码前台<div id="courseList"> <div id="content" v-cloak> <div class="div-relative" id="a" v-for="item in currentPageData"> <div class="bg1" :style="{backgroundImage: 'url(' + item.image + ')'}"></div>原创 2020-05-15 17:17:33 · 107 阅读 · 0 评论 -
关于document.getElementById()无法获取值的问题
今天前端数据交互时使用document.getElementById()无法获取iiput输入框的值点击按钮,获取input的值,并alert显示出来附错误代码var a = doucment.getElementById("content");$("submit").click(function{ alert(a);});以上代码运行出的结果为空原因是var a = doucm...原创 2020-03-23 16:01:42 · 2894 阅读 · 1 评论 -
解决前端button点击无法出现弹窗问题
解决前端button点击无法出现弹窗问题在前后端交互时,table每行动态生成一个按钮,需要点击按钮出现弹窗修改数据,但点击按钮无效,我的代码如下:html:<tbody v-for="item in emps"> <tr> <td>{{item.id}}</td...原创 2019-12-16 21:26:38 · 1468 阅读 · 0 评论