- 博客(72)
- 收藏
- 关注
原创 多行文本展开收起(css)
在实现之前,先了解文本超出部分省略的实现方法。单行文本:.text{ width: 250px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap;} 多行文本:.text { display: -webkit-box;//必须结合的属性 ,将对象作为弹性伸缩盒子模型显示 。 -webkit-line-clamp: 3;//用来限制在一个块元素显示的文本的行数 -webkit-
2022-02-21 15:30:50 3118 2
原创 基于vue的 表单设计器(拖拽生成表单)
日常开发时想要快速构建节省时间或者功能需求需要拖拽生成表单,推荐使用以下表单设计器。1.基于vue+elementui 的表单设计及代码生成器Form Generator码云仓库:form-generator: Element UI表单设计及代码生成器演示地址:form-generator...
2022-02-18 13:07:34 22288 9
原创 求两个正序数组的中位数
给定两个大小分别为 m 和 n 的正序(从小到大)数组 nums1 和 nums2。请你找出并返回这两个正序数组的 中位数。例:输入:nums1 = [1,3], nums2 = [2],输出:2.00000解题思路:1.对两个数组进行拼接并排序2.判断中位数var findMedianSortedArrays = function (nums1, nums2) { let nums3 = nums1.concat(nums2); let
2022-02-14 13:49:15 462
原创 找出给定数组中任意数字组成的三位偶数
题目描述:给出一个整数数组 digits ,其中每个元素是一个数字(0 - 9)。数组中可能存在重复元素。找出所有 :由数组中三个元素按任意顺序依次连接组成,不以零开头的不重复偶数。
2022-02-10 14:29:02 874
原创 若依框架的使用(前后端分离版)
若依是一套全部开源的免费的快速开发平台,可以迅速搭建项目。这里我们主要介绍前端的使用。介绍前端采用Vue、Element UI。 权限认证使用Jwt,支持多终端认证系统。 支持加载动态权限菜单,多方式轻松权限控制。 高效率开发,使用代码生成器可以一键生成前后端代码。功能用户管理:用户是系统操作者,该功能主要完成系统用户配置。 部门管理:配置系统组织机构(公司、部门、小组),树结构展现支持数据权限。 岗位管理:配置系统用户所属担任职务。 菜单管理:配置系统菜单,操作权限,按钮权限
2022-02-10 09:55:37 23940 3
原创 git切换库
开发过程中遇到远程库变更时,可以手动切换库。 在目录下打开git bash 删除现有远程仓库 git remote rm origin 添加新的远程仓库地址 git remote add origin 仓库地址 运行历史提交 git pull origin master --allow-unrelated-histories 关联仓库 git branch --set-upstream-to=origin/master master 测
2022-02-09 16:07:49 737
原创 求无重复字符的最长子串长度
已知:给定一个字符串 s,求 字符串 s 不含有重复字符的 最长子串 的长度。如输入:"abcabcbb" 应输出:"3" ,最长子串为abc分析:方法一:从字符的起始位置开始,找出以每一个字符开始的,不含重复字符的子串,计算出最大长度。我们使用两个指针表示字符串中的某个子串(或窗口)的左右边界,其中左指针代表着「枚举子串的起始位置」。在左指针向右移动的时候,我们从哈希集合中移除一个字符,在右指针向右移动的时候,我们往哈希集合中添加一个字符。代码如下var lengthO.
2022-02-09 16:00:47 1015
原创 两个链表相加求和
两个非空的链表,表示两个非负的整数。逆序存储,并且每个节点只能存储一位数字。var addTwoNumbers = function(l1, l2) { // 创建临时的链表 let resNode = new ListNode(0); // 记录好相关的临时链表信息 let res = resNode; // 记录是否进行进位运算 let flag = 0; //当l1不为空或l2不为空或不需要进位时 while(l1 |...
2022-01-28 10:23:09 795
原创 DataV构建大屏(全屏)数据展示页面
官方文档地址:DataV1.安装组件库npm安装 npm install @jiaminghi/data-view 2.使用 全局引入// 将自动注册所有组件为全局组件import dataV from '@jiaminghi/data-view'Vue.use(dataV)按需引入按需引入仅支持基于ES module的tree shaking,按需引入示例如下:import { borderBox1 } from '@jiaminghi/data-view'V
2022-01-28 10:02:37 19678 4
原创 vue-quill-editor富文本禁止粘贴图片
//添加匹粘贴板事件 handleCustomMatcher(node, Delta) { let ops = [] Delta.ops.forEach(op => { if (op.insert && typeof op.insert === 'string') {// 如果粘贴了图片,这里会是一个对象,如果是字符串则可以添加 ops.push({ insert: op.insert, .
2022-01-25 14:03:52 1825 1
原创 计算两个日期之间相差的天数
用于计算两个日期字符串之间相差的天数,首先求出两个日期之间相差的毫秒数,然后除以一天的毫秒数。function getDays(date1 , date2){ var t1 = date1.getTime(); var t2 = date2.getTime(); var dateTime = 1000*60*60*24; //每一天的毫秒数 var minusDays = Math.floor(((t2-t1)/dateTime));//计算出两个日期的天数差 var days = Math
2022-01-25 13:51:32 2262
原创 resetfileds失效问题
在vue中我们使用el-dialog时,先点击编辑,再点击新增时,会出现被填充的情况,此时已经设置对话框关闭后resetfileds,但是仍然不起作用。解决:在设置回显值的时候,不要直接赋值,在外边加上setTimeout或者this.$nextTickthis.dialogVisiblews=true;this.$nextTick(function(){ this.formData = response.data; })//setTimeout(function(){ // this
2022-01-25 11:26:46 927
原创 split,slice和splice的用法及区别
1.split(字符串)用法:string.split(separator,limit)参数:可选参数limit可以限制被分割的片段数量。separator参数可以是一个字符串或一个正则表达式。主要用于字符串的分割,可以根据某个字符把字符串拆分成多个数组。var date1 = "2017-08-12";var date1Str = date1.split("-");//['2017','08','12']2.slice(字符串)用法:string.slice(start,end
2022-01-25 09:54:31 1887
原创 echarts图表旋转
可以在div上设置旋转角度,这里我们设置角度为-15° -moz-transform:rotate(-15deg); -webkit-transform:rotate(-15deg); -o-transform:rotate(-15deg); transform:rotate(-15deg); filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);旋转前旋转后...
2021-12-22 09:24:40 4733 3
原创 echarts实现省份地图
以吉林省为例1.下载json文件首先获取文件,将省份对应的json文件下载下来放到项目文件中,建议放到public里,2.引入echartsimport * as echarts from 'echarts'3.准备dom容器<div id="area"></div>4.本地发起axios,需要npminstallaxios--saveaxios ,然后引入import axios from 'axios'import Vue f...
2021-12-21 17:23:38 7592 4
原创 echarts实现词云
1.安装或下载首先在官网下载需要的文件GitHub - ecomfe/echarts-wordcloud: Apache ECharts Word Cloud extension based on wordcloud2.js< script src =" echarts.min.js " > </ script > < script src =" echarts-wordcloud.min.js " > </ script >或者通过npm
2021-12-21 16:20:15 1444
原创 echarts中tooltip的属性
tooltip: { //悬浮框 show: true, // 是否显示 trigger: 'axis', // 触发类型 'item'图形触发:散点图,饼图等无类目轴的图表中使用; 'axis'坐标轴触发;'none':什么都不触发。 axisPointer: { // 坐标轴指示器配置项。 type: 'shadow', // 'line' 直线指示器 'shadow' 阴影指示器 'none' 无指示器 'cross' 十字准星指示器。 axis: 'auto',.
2021-12-21 16:05:01 7131
原创 echarts中tooltip的位置设置
对于echarts中的tooltip位置有三种设置方法。方法一:通过数组设置提示框位置(1)数字设置绝对位置 position: [10, 10]tooltip: { trigger: 'axis', position: [10, 10]// position: ['10px', '10px']},(2)百分比设置相对位置 position: ['50%', '50%']tooltip: { trigger: 'axis', // 相对位置 positio...
2021-12-21 15:50:08 22734 1
原创 proxy解决跨域问题
为什么会跨域? 在前后端分离的模式下,前后端的域名是不一致的,此时就会发生跨域访问问题。跨域问题来源于JavaScript的同源策略,即只有 协议+主机名+端口号(如存在)相同,则允许相互访问。跨域问题的解决方式? JSONP,CORS,iframe,proxy等。 这里我们详细介绍proxy解决跨域。proxy解决跨域 在vue.config.js中进行配置:module.exports = { //根路径 cli3.0以...
2021-12-15 09:55:22 2315
原创 函数柯里化
函数柯里化指的是将能够接收多个参数的函数转化为接收单一参数的函数,并且返回接收余下参数且返回结果的新函数的技术。函数柯里化的主要作用和特点就是参数复用、提前返回和延迟执行。const add = function add(x) { return function (y) { return x + y }}const add1 = add(1)add1(2) === 3add1(20) === 21...
2021-06-30 23:30:50 123
原创 JS的四种设计模式
工厂模式function CreatePerson(name,age,sex) { var obj = new Object(); obj.name = name; obj.age = age; obj.sex = sex; obj.sayName = function(){ return this.name; } return obj;}var p1 = new CreatePerson("longen",'28','男')
2021-06-30 22:36:28 153
原创 浏览器的重绘和回流导致的性能问题
重绘:当节点需要更改外观而不会影响布局的,比如改变color就称为重绘 回流:布局或者几何属性需要改变就称为回流。 回流必定会发生重绘,重绘不一定会引发回流。回流所需的成本比重绘高的多,改变深层次的节点很可能导致父节点的一系列回流。所以以下几个动作可能会导致性能问题: 改变 window 大小 改变字体 添加或删除样式 文字改变 定位或者浮动 盒模型 重绘和回流其实和 Event loop 有关。减少重绘...
2021-06-30 22:19:09 429
原创 web前端优化策略
(1)减少HTTP请求数(2) 从设计实现层面简化页面(3) 合理设置HTTP缓存(4)资源合并与压缩(5) 合并CSS图片(6) 网页内联图片(7) 图片懒加载
2021-06-30 22:00:31 426
原创 循环遍历输出JSON对象
<script> var data=[{name:"a",age:12},{name:"b",age:11},{name:"c",age:13},{name:"d",age:14}]; for(var i in data){ console.log("姓名:"+data[i].name+" 年龄:"+data[i].age ); } </script>
2021-06-30 21:22:18 528
原创 三种常见的排序算法
1.冒泡排序 function bubble(ary) { let temp = null; // 外层循环i控制比较的轮数 for(let i=0;i<ary.length-1;i++){ // 里层循环控制每一轮比较的次数j for(let j=0;j<ary.length-1-i;j++){ if(ary[j]>ary[j+1]){ // 当前项大于后一项 temp = a
2021-06-30 20:19:29 189
原创 Vue组件通信
1.属性传递 只能父传子2.发布订阅(EventBus):$on/$emit 父props,子$emit3.Provide/injectprovide / inject API 主要解决了跨级组件间的通信问题,不过它的使用场景,主要是子组件获取上级组件的状态,跨级组件间建立了一种主动提供与依赖注入的关系。4.slot5.$parent /$children无法在跨级或兄弟间通信6.vuex 页面刷新就消失本地存储方案 localstorage...
2021-06-30 10:52:21 68
原创 跨域问题的产生及解决
浏览器本身的特点: ajax跨域是指浏览器允许向服务器发送跨域请求,从而克服Ajax只能同源使用的限制。1. JSONP跨域解决方案的底层原理动态插入<script>元素get请求<script src='http://api.qq.com/list?caollback = func'>function func(data) {//data就是服务器获取的数据}缺点:不安全 有缓存 大小限制2. 基于iframe的跨域解决方案window.
2021-06-30 10:30:45 72
原创 Vue2.0/3.0双向数据绑定的实现原理
vue 2.0 姓名:<span id="spanName"></span> <br> <input type="text" id="inpName"> <script> // 1.对原始数据克隆 // 2.需要分别给对象中每一个属性设置监听 let obj = { name: '' }; let newObj = JSON.parse(JSON.stringify(obj)); Obje.
2021-06-30 08:53:01 60
原创 ==和===的区别
区别:==, 两边值类型不同的时候,要先进行类型转换,再比较。 ===,不做类型转换,类型不同的一定不等。==左右两边数据类型不一样转换规则:(1)对象==字符串,是通过对象.toString()变为字符串(2)null==undefined 相等,但是和其他值比较就不再相等了(3)NaN==NaN不相等(4)剩下的都是转换为数字...
2021-06-29 17:32:03 123
原创 同步异步面试题
我们来看一道面试题: <script> async function async1() { console.log('async1 start'); await async2(); console.log('async1 end'); } async function async2() { console.log('async2'); } console.log('script start'); setTime
2021-06-29 14:27:36 618
原创 快速理解掌握闭包
定义:当一个函数的返回值是另外一个函数,而返回的那个函数如果调用了其父函数内部的其它变量,且返回的这个函数在外部被执行,就产生了闭包。特点:1.函数嵌套函数2.函数内部可以引用外部的参数和变量3.参数和变量不会被垃圾回收机制回收var test = (function (i) { return function () { alert(i *= 2);//alert弹出的结果都会转化为字符串}})(2);test(5);结果:‘4’var a = 0;b...
2021-06-28 22:42:52 114
原创 装箱和拆箱
装箱:把基本数据类型转化为对应的引用数据类型的操作。装箱分为隐式装箱和显式装箱两种装箱方式。隐式装箱是由引擎自动执行的var s1 = new String('hello');var s2 = s1.substring(2);s1 = null;在读取值的时候,引擎会创建一个基本类型所对应的「包装类型的对象」,在这个基本类型的对象上调用方法,其实就是在这个基本类型对象上调用方法。这个基本包装类型的对象是临时的,它只存在于方法调用那一行代码执行的瞬间,执行方法后立即被销毁。显式装箱.
2021-06-28 20:44:59 65
原创 valueOf 和 toString之间的区别
区别:valueOf()方法如果存在任意原始值,它就默认将对象转换为表示它的原始值;对象是复合值,默认的valueOf()方法返回对象本身,而不是返回一个原始值。 toString()方法返回反映这个对象的字符串。常常使用Object.prototype.toString()来进行类型识别,返回代表该对象的[object 数据类型],字符串表示。...
2021-06-28 20:01:59 244
原创 对象和数组的区别
(1)创建方式不同:数组表示有序数据的集合,而对象表示无序数据的集合。数组的数据没有”名称”(name),对象的数据有”名称”(name)。(2)调用方法不同(3)对象键值唯一,数组可以重复(4)对象没有长度,不能用for循环...
2021-06-28 19:37:08 5068
原创 BFC和IFC区别
BFC块级格式化上下文https://blog.csdn.net/weixin_43765747/article/details/118002420IFC内联格式化上下文块容器盒中只有内联级盒子,每一行盒的高度由行盒内最高的inline-box决定,当display设置为inline-block的时候会产生一个IFC.主要影响IFC内布局的CSS属性:font-size line-height height vertical-align区别:在BFC中只会包含块级元素,在IFC.
2021-06-28 11:29:45 365
原创 浏览器的内核
IE: trident内核Firefox:gecko内核Safari:webkit内核Opera:以前是presto内核,Opera现已改用Google Chrome的Blink内核Chrome:Blink(基于webkit,Google与Opera Software共同开发)
2021-06-27 23:20:21 41
原创 Canvas与SVG的区别
区别一:svg绘制出来的每一个图形的元素都是独立的DOM节点,能够方便的绑定事件或用来修改。canvas输出的是一整幅画布;区别二:svg输出的图形是矢量图形,后期可以修改参数来自由放大缩小,不会是真和锯齿。而canvas输出标量画布,就像一张图片一样,放大会失真或者锯齿。Canvas的方法:getContext():返回一个对象,提供了用于在画布上绘图的方法和属性beginPath():起始一条路径,或重置当前路径closePath():创建从当前点回到起始点的路径lineTo.
2021-06-27 23:02:08 110
原创 html5新特性
一、绘画 canvasHTML5 标签用于绘制图像(通过脚本,通常是 JavaScript)。二、用于媒介回放的video和audio元素HTML5 DOM 为audio和video元素提供了方法、属性和事件。这些方法、属性和事件允许您使用 JavaScript 来操作audio和video元素。三、本地离线存储localStorage长期存储数据,浏览器关闭后数据不丢失localStorage :没有时间限制的数据存储四、sessionStorage的数据在浏览器关闭后自动删除
2021-06-27 22:22:41 53
原创 文档流,脱离文档流的方式
文档流:内联元素默认从左到右流,遇到阻碍或者宽度不够自动换行,继续按照从左到右的方式布局。块级元素单独占据一行,并按照从上到下的方式布局。脱离文档流:脱离文档流,即将元素从普通的布局排版(普通文档流)中脱离出来。float浮动。 position的absolute和fixed定位。...
2021-06-27 22:06:24 349
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人