学习笔记
runOnWay
这个作者很懒,什么都没留下…
展开
-
输入框点击出现下拉框。下拉框点击不隐藏下拉框同时出现详情弹窗
需求:实现如下图分析:1.下拉框带搜索,一般情况下使用el-select组件完成,该需求存在的问题是点击选项,不能隐藏下拉框,同时显示详情信息。使用el-select未找到能够实现下拉框不隐藏的方法,因此弃用el-select。2.抛去搜索下拉框,这个样式很符合el-popover的情况。尝试使用el-popover实现过程:方法1初步思路: popover1,template是el-input,内容是一个列表循环出的template为p标签的popover2。popover2的内容就是详情。原创 2022-04-18 14:23:54 · 3999 阅读 · 2 评论 -
vue3 update:modelValue 线上环境报错modelValue is not defined
在使用vue3进行开发子组件显示隐藏时,我们在父组件中给子组件传递v-model:visible来标识子组件的显隐。一般情况,父组件中代码为如下:<Child v-model="drawerVisible" ... />子组件,一般使用el-plus中的drawer或modal等弹出框,以下以el-drawer为例<template> <el-drawer v-model="visible" title="..." directi原创 2022-03-28 13:50:57 · 6756 阅读 · 15 评论 -
go channel的关闭时机和阻塞问题
问题:1.在close(chan)语句后,是否直接关闭了channel。如果不是,channel何时被关闭的;2.读取channel中的值时,若channel中无值,会阻塞后边的语句,那么通过range读取channel中的值,何时会跳出range接着执行结论:1.channel的关闭时机:1)给channel调用close()且其中数据全部被消费结束。2)主线程关闭2.通过range取channel中的值,如果channel一直未被关闭,则range会一直阻塞后续代码执行。只有channel被关闭,原创 2021-12-16 11:15:21 · 3516 阅读 · 1 评论 -
git报错would clobber existing tag
使用vscode自带的git界面操作pull,有可能出现关于tag的错误would clobber existing tag,导致无法pull解决方案:1.在terminal直接输入git pull,完成代码拉取。代码虽然拉取了,但vscode的git工具还是不能用2.在terminal输入git fetch --tags -f,先完成对本地代码tag的强制更新。再使用vscode的git工具拉取代码...原创 2021-12-14 16:30:58 · 8269 阅读 · 0 评论 -
VueDraggable 子元素input选中文字会出现拖动
vuedraggable,el-input原创 2021-12-09 15:54:23 · 1755 阅读 · 5 评论 -
python3合并excel表格简述
需求:多个excel表格,表头相同,表格内容不同。将多个合并成一个表格。系统:macOS 11版本:python3.9代码:import pandas as pdimport os#文件路径file_dir = r'/Users/xxx/Desktop/合并excel代码'#构建新的表格名称new_filename = file_dir + '/new_file.xlsx'#找到文件路径下的所有表格名称,返回列表file_list = os.listdir(file_dir)原创 2021-04-30 03:29:59 · 579 阅读 · 0 评论 -
vue-router3.0 报warning无法匹配路由
使用this.$router.push({ name: ‘xxx’ }),xxx为路由的name值,达到跳转页面的目的,vue-router报错如下:missing param for named route “xxx”: Expected “0” to be defined解决如下:this.$router.push({ name: 'xxx', params: { '0': 'xxx' }})虽然解决了,但是完全不知道为何发生,又为何结束...原创 2020-11-26 16:05:45 · 2467 阅读 · 4 评论 -
Bootstrap fileinput插件删除未上传文件的坑
个人比较看好的中文文档:http://bootstrap-fileinput.com/options.html背景上传文件或图片,判断名称是否符合规则、不可重名。初期实现思路全局定义变量filenames,存储已上传文件名。在filebatchselected事件回调函数中,获得选中文件的文件名,判断是否在filenames中(判断命名规则),若无可选中,名称添加至filenames中。若有,选中.kv-file-remove(按钮的类名),点击事件,删除。调用删除回调函数filesuccessr原创 2020-07-14 13:39:00 · 1239 阅读 · 0 评论 -
单点登录逻辑简单梳理
目的:为解决现在各种服务越来越多,若不使用单点登录,则需要用户登录每个服务,即多次登录,体验很差。单点登录是用户只需要登录一次,就相当于登录了所有服务。之前以为cas + uim、cas + shiro、 jwt等都是实现单点登录的常见组合。后来发现,cas是中央认证服务,负责用户管理,为单点登录服务。而uim和shiro是用户权限控制的服务。因此若不需要权限控制,只要单点登录,则只需要cas...原创 2019-11-25 09:49:48 · 974 阅读 · 0 评论 -
svg在firefox和safari或chrome中的显示差异
<svg xmlns="http://www.w3.org/2000/svg"width="300" height="100" viewBox="0 0 300 100" style="padding-left: 20px !important"><text x="-15" y="30" style="fo原创 2018-11-15 17:20:51 · 2974 阅读 · 0 评论 -
react16 各类控件ref取值方式
input:this.myref.current.input.valueselect: this.myref.current.rcSelect.selectionRef.textContentradio: this.myref.current.state.valuetextarea: this.myref.current.textAreaRef.value原创 2018-09-17 16:27:09 · 2082 阅读 · 2 评论 -
react引入d3相关问题
1. 开源的d3例子有一些是用了V3的,在V4后更改了一些api问题:react直接npm install –save d3,安装的是最新版,目前是V5,api的更改导致功能无法实现。 目前遇到的更改了的api是d3.layout, d3.svg。layout和svg其中的所有方法都失效,比如d3.layout.tree,d3.svg.diagonal。 解决:安装V3...原创 2018-08-13 19:27:59 · 3833 阅读 · 2 评论 -
echarts柱状图x轴label简写显示全
具体要解决的问题见上图。本文只讲述要用的的配置项和思路。具体细节不多描述 注:。。。代表和本文无关app.title = '坐标轴刻度与标签对齐';option = { color: ['#3398DB'], tooltip : {。。。 }, grid: {。。。 }, xAxis : [ { type :...原创 2018-07-12 13:28:13 · 2796 阅读 · 0 评论 -
js深拷贝注意事项
1.使用Object.assign(newObj, oldObj);只深拷贝了oldObj的第一层,之后的层级仍是浅拷贝。如:oldObj = {a:1, b: 2}; 此时深拷贝没问题如:oldObj = {a:1, b: { c: 4 }}; 此时newObj.a和newObj.b都不会影响oldObj,但newObj.b.c则会影响oldObj。2.使用“…”扩展运算符,细节同上3...原创 2019-06-26 17:07:45 · 716 阅读 · 0 评论 -
setInterval的弊端和解决方案
在需要重复发送请求或者某些效果的时候,一般都会想到使用setInterval,但是它的一些弊端,会给程序带来很大的隐患一、弊端 1.setInterval对自己调用的代码是否报错漠不关心。即使调用的代码报错了,它依然会持续的调用下去 2.setInterval无视网络延迟。在使用ajax轮询服务器是否有新数据时,必定会有一些人会使用setInterval,然而无论网络状况如何,它都会去一遍...原创 2018-07-03 16:20:26 · 23473 阅读 · 4 评论 -
echarts中xAxis的type=‘time’
当type=time时,x轴不需要再另外设置data。只需要再series中的data设为二维数组,每个元素是时间戳和值。此时x轴会自定刻度间隔,需要自定义的话,使用splitNumber属性如想获取当前时间前24小时,每隔半小时显示一个随机数。把下面获得的data赋值给series中的data属性即可伪代码:let a = [];let now = Date.parse(new Da...原创 2018-11-15 17:33:24 · 13540 阅读 · 1 评论 -
echarts中热力图和日历组件的结合
echarts中热力图和日历组件的结合function getVirtulData(year, month) { //随机生成月份的值 var date = +echarts.number.parseDate(year + '-' + month + '-01'); var end = +echarts.number.parseDate(year + '-' + (month+1) + '-...原创 2018-11-17 15:59:47 · 2007 阅读 · 0 评论 -
获取某天前几天的方法
function getBeforeDate() { let data = []; let date = new Date(); let year = date.getFullYear(); let month = date.getMonth() + 1; let today = date.getDate(); let lastMonthdays = new Date(year, mo...原创 2018-12-26 15:36:03 · 568 阅读 · 0 评论 -
使用postMessage方法完成跨域页面通信
背景:本项目A中的用户管理打开另一个系统B的用户管理页面,需要传递用户信息。问题:1.需要传递用户相关信息,所以不能通过url传递参数,存在安全风险;2.两个系统,跨域,无法单纯使用sessionStorage或localStorage方案:1.使用iframe + postMessage;2.使用postMessage方案一:1.A页面中加入iframe,链接为B...原创 2019-03-22 14:22:31 · 770 阅读 · 0 评论 -
防抖和节流参考
https://www.jianshu.com/p/c8b86b09daf0很有帮助转载 2019-06-26 17:42:50 · 166 阅读 · 0 评论 -
css3属性识别文本框行数并处理
需求:当表格单元格内容超过4行时,隐藏多余部分并显示展开按钮。不超过4行的,正常显示且不显示展开按钮。背景:使用dva相关技术栈 + jquery + css3 + antD分析:刚接到这个需求的时候,由于对css3属性了解的不够透彻,并未直接想到使用css3的webkit-line-clamp属性。最开始想的是由于单元格宽度不固定,且中文、英文、数字和符号等宽度不同,也无法使用string...原创 2019-07-21 14:02:18 · 1804 阅读 · 0 评论 -
快速排序
var arr = [23,24523,423,41,523,233,552];function q(arr){ if(arr.length1) return arr; var s = arr[0]; var big = []; var small = []; for(var i=0;ilength;i++){ if(arr[i]>s){原创 2018-01-30 16:54:47 · 241 阅读 · 0 评论 -
react-router4.0之后路由定义的改变
在4.0版本之前,路由的定义是在src/router.js中定义嵌套路由。代码如下:&lt;Router history={history}&gt; &lt;Route path="/" component={IndexPage} &gt; &lt;Route path='/a' component={a} /&gt;原创 2018-06-13 11:38:25 · 1446 阅读 · 0 评论 -
敏捷开发总结
一、敏捷开发是一种开发方式 敏捷开发,英文是Agile Development,是一种以人为核心、迭代、循序渐进的开发方式,是一种软件开发的流程。它会指导开发人员用规定的环节去一步一步完成项目的开发。由于它采用迭代式开发,所以它主要的驱动核心是人,而不是像瀑布模型那样,以文档为核心。 敏捷开发更注重的人与人之间的沟通、交流。它认为个体和交互胜过过程和工具,可以工作的软件胜过...原创 2018-05-24 11:20:45 · 1311 阅读 · 0 评论 -
vue-cli以webpack-simple+elementui配置
vue开发中,使用vue-cli脚手架快速搭建框架,之后引入elementui进行开发,在按照官网指示引入elementui后,会报错,关于font的错误。 此时需要在webpack.config.js中更改相关配置。 在rules中加入以下代码{ test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, loader: 'url-原创 2018-01-10 12:56:12 · 1088 阅读 · 0 评论 -
Vue中render中的h箭头函数
vue2.0新增了render方法,官方案例写的是:render: h=>h(app)其中h是由createElement方法演变而来render: function(createElement){ return createElement(app)}用es6的写法就是:(只有一个个return语句,可以省略return和{})render: createEl原创 2018-01-18 15:00:07 · 3230 阅读 · 0 评论 -
生成日历数组(套路)
生成日历数组,有3个要素。 1.本月共有多少天; 2.上个月一共有多少天(即上个月最后一天是几号); 3.本月第一天是星期几 使用Date(),参数分别是this.year(之前定义的年),this.month(之前定义的月) 在向数组中插入数据时,因为需要判定本月和上月或下月,便于设置类等,所以插入数组中的时对象,包含日期和类名判断等。 方法如下:定义一原创 2018-01-09 14:07:07 · 1501 阅读 · 0 评论 -
使用use注册Vue全局组件和全局指令
Vue中的组件和指令分为局部组件、局部指令和全局组件、全局指令。对于注册有一定数量的全局指令和全局组件时,官方文档中的方法就显得有些不够清爽了。全局组件 在Vue官方文档中介绍的是使用Vue.component(tagName, options)来创建一个全局组件。但是这种方法是与根实例写在同一个文件中,如果要同时注册多个全局组件,就会使根实例文件过重,因此使用Vue.use()来“安装”原创 2018-01-07 23:11:16 · 19216 阅读 · 6 评论 -
css中li下边框盖住ul下边框问题
在用ul标签做tab栏时,想实现ul一个底边框线是统一的颜色,在当前li上,要给li一个其他颜色的底边框线,盖住ul的底边框线。实现以下效果 灰线是ul的线,红线是li的线。我发现无论如何写,li的高度加上边框线的高度都会把ul高度撑开,始终都会露出ul的线。 灵机一动,把ul放在一个div盒子中,给div设置底边框线,再设置一个合适的高度,而不给ul设置。 完美解决原创 2018-01-16 13:40:22 · 4779 阅读 · 0 评论 -
JS中需要注意的点(二)
条件语句和循环语句不能阻止var声明的变量声明的提升。(建议使用ES6中的let声明变量)。break关键字打破循环时,在未给循环命名的时候只会打断本层循环。在使用命名后,break会同时打破本层和命名层。function关键字定义的函数,js会始终在调用它前解析它。 举个例子: var a = function(){①}; function a(){②}; a(); 这段伪代码会执行原创 2018-01-05 16:14:13 · 228 阅读 · 0 评论 -
JS中this指向规则(简单易懂)
js中,this 的指向是看this是谁调用的,而不是在哪里定义的。只定义而未调用,此时this的指向是未知的,只有调用后才能知道this的指向。小括号()直接调用,无打点,this指向全局window;IIFE中的this自执行时同理,一定指向windowvar a = 2;var obj = { a : 1, foo : function(){原创 2017-11-18 12:13:09 · 2068 阅读 · 0 评论 -
JS中需要注意的点(一)
数字类型中的八进制,是以0o(数字0和字母o开头),字母o不区分大小写。 在某些时候不注意会出现0o99这种尴尬的错误。十六进制是以0x开头,字母x同样不区分大小写。浮点数中0.**中的的0可以省略。 如:console.log(.7);Infinity 和 NaN(Not a Number) 都是Number类型。 其中Infinity区分正负值。0参与计算时,0作为除数(在数学原创 2018-01-05 14:44:38 · 390 阅读 · 0 评论 -
vue-lazyload使用图片路径的坑!!
使用vue-cli脚手架快速生成的框架中, src**同级目录**中有static文件夹 src**子文件夹**中有assets文件夹 在使用vue-lazyload,设置error或loading属性的图片路径时,图片在assets文件夹,就需要使用require()进行引入。Vue.use(VueLazyload, { preLoad: 1.3, loading:原创 2018-01-13 16:34:15 · 8192 阅读 · 1 评论 -
更改babel-preset-env错误翻译fetch语法配置
现代浏览器本身识别fetch语法,但是babel-preset-env会错误翻译它,因此需要安装另一个依赖修正。 babel-plugin-transform-runtime$ npm install --save-dev babel-plugin-transform-runtime安装依赖后,更改webpack.config.jsloader: "babel-loader",原创 2018-01-13 13:13:16 · 996 阅读 · 0 评论 -
toutiao部分面试题
for in 和 for of 的区别 for in 返回的是数组元素的索引值或者对象的key 会遍历出所有可枚举的属性,包括原型链上的。 for of 返回的是数组元素,不能遍历对象。也不包括原型链上的 Object.key() 遍历对象返回对象的key,不包括原型链上的同域跨标签通信 用window.localStorage属性,因为它可以储存的东西更多,比cookie更方便,且关原创 2018-02-04 19:21:36 · 251 阅读 · 0 评论 -
阿里大于实现短信验证码node.js(最新版)
阿里大于账号的申请和短信签名、短信模板的申请,在此不再赘述。 本文主要介绍的是在nodejs上的代码实现。 要点:安装npm包SDK的引用验证码生成后和前端的匹配验证码格式1.除了正常开发需要安装的npm包之外,关于阿里大于的只需要安装一个,原因是阿里大于和阿里云合并了$ npm install --save @alicloud/sms-sdk2.首先是sdk的引用,...原创 2018-02-12 12:19:05 · 1208 阅读 · 0 评论 -
git命令
git记录的是每一次对文件的修改,而不是每个文件 1.git回退至上次的commit: 首先用git log查看提交日志,从近至远的,详细的显示 每次提交成一行显示:git log –pretty=oneline git log –graph 图表方式显示log -p 按补丁格式显示每个更新之间的差异。 –stat 显示每次更新的文件修改统计信息。 –shortstat 只显示 –s...原创 2018-05-21 15:49:59 · 276 阅读 · 0 评论 -
angular react vue优缺点对比
今天分享的内容是前端3大框架,主要有介绍前端的发展历程,框架出现的原因和介绍angular、react和vue各自的优缺点,让大家能够对这3个框架有一个大致的了解。 首先介绍一下前端技术的发展 1994年可以看作是前端历史的一个起点,在这一年的10月13日,网景公司推出了第一版的navigator,这一年tim创建了w3c,他的好基友发布了css,还是这一年,php诞生。 navigator...原创 2018-04-27 10:06:31 · 5196 阅读 · 0 评论 -
teamviewer13安装个人免费版
正常安装teamviewer时如果安装选择了商业用途,会需要买许可证,试用期只有7天。 解决办法,卸载原先安装的tw,删除掉所有有关文件夹,比如C盘中的program(x86)和用户文件夹中的appdata文件夹中。 然后更改本机mac地址,打开网络共享中心,选择配置(就是准备改ip地址的那个窗口)—>高级—>本地管理地址—>在值那一项随便填一个,比如:00112233445...原创 2018-04-24 13:57:20 · 14453 阅读 · 0 评论 -
vscode使用git管理代码
visual studio code(以下简称vscode)集成了Git管理,但是在网络上找了很多资料,只有如何创建本地环境的介绍而没有如何使用,这对我刚接触Git时造成了很大困扰,也弄崩了公司git上的一个分支,幸好时分支。。。 下面简述几点在vscode上使用git的方法(我是前端) 1. 第一次使用git管理代码的时候,从远端拉去代码到本地,由于node_modules和bower_co...原创 2018-03-20 10:46:36 · 14401 阅读 · 3 评论