- 博客(83)
- 资源 (7)
- 问答 (5)
- 收藏
- 关注
原创 elementui tree 层级过多时,高亮状态无法选满整行
添加高亮状态的 div 并没有随着子级的展开而适应宽度,所有的tree-node 的宽度在初始化的时候就固定了。通过fit-content 可以将宽度随着内容撑开,而min-width 会保证没有那么多层级时也可以左右排布。(treeWidth 表示的是整个tree 容器的宽度,要是需要留有间隙,可以减去 10 或者 20 像素)如上图所示,官方的tree组件,在层级很多时 elementui -tree 的高亮状态并没有选中整行。此时只需要tree根据弹窗自动铺满就好了,不用考虑min-width。
2023-08-29 16:49:27
1108
原创 elementui table 在浏览器分辨率变化的时候界面异常
在父级添加 width: 100% 时,aside 定宽不变,但是对于main 则改用calc: (100% - 定宽)。我最开始的方案是aside 定宽,main则使用flex:1 的方式。(这种方式就会出现上面所说的异常点)效果惊人的好,此时无论如何调整浏览器分辨率,el-table 都可以正常显示,且没有出现卡顿的情况。所以我的想法是,监听浏览器的resize事件,然后执行doLayout 方法。偶尔可以解决,偶尔又出现了,,,四舍五入等于没解决。是的,没错,调整css样式就可以。
2023-08-26 17:34:15
1483
原创 linux 环境执行npm没有反应 (省流:卸载重装)
今天早上在执行工程时,发现没有反应,也没有提示任何错误,就直接跳过了。接着我又试了试其他命令 npm -v / npm init / npm …都无效。
2023-06-10 15:20:45
1971
原创 elementui tree 支持虚拟滚动和treeLine (下)
npm发布,自己引入运行后,但是还是出现了问题二的cant resolve 问题。去npm 上查看,发现提交的内容和自己本地的不一致我这里是因为里添加了file 字段,摒弃了提交内容。调整 package.json 后再发布,发现就可以了。
2023-06-09 17:23:39
1732
2
原创 elementui tree 支持虚拟滚动和treeLine (上)
最终在查阅相关资料时,发现github有一个大佬使用vue-virtual-scroller自己写了一个elementui tree的扩展组件。同时这款组件还能完美的继承elementui tree上的属性和方法,算是过渡最为平滑的组件了。需求变更:虽然虚拟滚动实现了,但是在演示的时候领导觉得,还是加个treeLine 更好看。所谓的treeLine 就是tree展开时,侧边那一条条带有结构性质的边线。确认这个ui就是我们要的,下一步就是发布到npm了。的源码上进行调整,毕竟业务代码已经写了那么多了。
2023-06-09 14:29:36
3237
原创 如何在离线环境中添加全局依赖?
我们公司开发环境是离线开发,一些依赖安装还是挺麻烦的,这里记录一下离线环境添加全局依赖的方法这里依赖一个包管理工具npm-pack-all外网环境安装 npm-pack-all cnpminstall-g npm-pack-all 外网环境安装所需全局依赖,例如 vuese cnpminstall-g @vuese/cli 外网环境制作tgz文件 npm root -g —— 找到默认的全局npm 位置,eg: C:\KSVDUsers...
2022-05-14 14:00:28
1409
原创 nvm 使用小记
使用nvm主要分为三步:1. 卸载node2. 安装nvm3. 使用nvm下载并使用node卸载node安装nvm之前需要先卸载之前安装好的node,window可以通过应用程序卸载在 C:\Users<user>\AppData\Roaming\npm 中可能也有残留,需要手动卸载安装nvm在官方下载地址中选择 nvm-setup.zip 后安装安装路径建议安装在其他盘。例如 D:\nvm (nvm 和 node 建议都安装在同一目录)安装完成后运行..
2022-04-17 12:25:08
758
原创 git clone 总是提示 Permission denied
这几天我重装了系统后发现,git clone 仓库时提示git@git.xxxxx.com: Permission denied, please try again.fatal: Could not read from remote repository.我第一反应就是去查看gitlab 上的秘钥和我本地的秘钥是否一致,结果两者并无不同然后我就打电话给了度娘,发现无数个博客都是让我再重新设置一遍秘钥经过十来次各种花样的 ssh-keygen 之后,我悟了~这条路走不通!!之后我脑
2022-03-26 16:26:48
1969
1
原创 elementui 表单验证集合
1.多个字段使用同个校验规则validator { validator: validateIP, trigger: 'blur', name: '首选DNS', empty: true } { validator: validateIP, required: true, trigger: 'blur', name: '网关' }可以在对象中扩展自定义参数,例如name,empty 等统一在校验处理函数中通过rule 获取callback(new Error(rule.name ..
2021-10-28 11:36:37
799
原创 js 判断掩码与ip是否匹配
参考地址:js校验ip、子网掩码、网关的合法性// (掩码,ip)// 掩码可以是数字类型也可以是ip类型// 返回一个boolean,掩码是否与ip一致function matchMask(mask, ip) { let checkMask = mask; if(!isNaN(Number(mask))){ checkMask = getMaskIp(mask).join(".") } return ipToint(checkMask) &am
2021-07-05 11:20:57
813
原创 vue 路由警告 Duplicate named routes definition
今天在开发的时候,项目报了一个警告Duplicate named routes definition ,这里记录一下解决方式和思路。警告产生的原因根据提示内容,我们大概猜测是和路由的name有关,上网了解了一下,验证了我们的猜测是正确的。警告是由于路由的name 重复导致的。(原理?who care (艹皿艹 ))错误类型虽然我们已经知道警告是由于name重复导致,其实细分一下还是有点不一样的。一是静态路由中的name重复,一是动态路由的name 重复举例说明静态路由:..
2021-04-21 15:38:14
68284
12
原创 都1202年,我才知道 Tailwindcss
今早8:00闹钟响起,8:30我依旧刷着视频,无意间看到一个it老哥的分享,介绍他自己做外包用的一些技术:vue?(规规矩矩)uni-app(还可以)nuxt(还不错)tailwindcss (嗯?这啥?看样子是个ui库,有空了解一下)(ps: 原谅我第一眼看成了”台湾“的拼音,”taiwan“)。这不,一大早趁着领导都去开会的功夫搜了一下Tailwindcss,不搜不知道,一搜吓一跳,好评如潮。那不得好好研究研究,所以就有了本篇文章。Tailwind 与传统的ui库有什么不同?.
2021-03-22 12:09:49
2466
原创 wordpress 建站,新手可看(四)
到这,wordpress 的基础介绍已经结束了。最后,另开一趴,记录一些补充的内容。参考资料建站服务器搭建网站完整教程(宝塔面板+wordpress),一键部署:软件商店 \ 宝塔插件 \ 宝塔一键部署源码插件WordPress多语言翻译插件:wpml使用教程好用的主题Zakra Theme主题网demosites博客wordpress网站开通邮件功能完整版WordPress配置发送邮件WordPress系列教程...
2021-03-18 19:59:16
142
原创 wordpress 建站,新手可看(三)
之前我们已经实现在网站利用wordpress 搭建一个简单的网站。wordpress建站,新手可看(一)wordpress建站,新手可看(二)接下来,这里记录一些自定义修改模板的一些方法。如何在页面中添加合作商logo?相关插件这里我们需要利用到的插件是GS Logo Slider Lite通过后台插件库既可以搜索安装。安装成功之后侧边栏会生成这样的管理菜单。如何使用首先点开侧边的 install Demo,下载完成后可以在 Logo Shortcodes..
2021-03-16 21:31:15
373
1
原创 wordpress建站,新手可看(二)
之前我们已经在宝塔上对wordpress进行了基本的安装,详情可点击wordpress建站,新手可看(一)接下来就是通过wordpress搭建一个网站了。后台访问访问你在宝塔上配置的域名,在域名后添加/wp-admin,例如 http://www.***.com ,即可访问 http://www.***.com/wp-admin第一次访问需要填入一些信息需要的信息我们可以去宝塔上查看接下来就是下一步的安装了,需要注意的是这里的用户名和密码要记牢以上都完成后就可以进入.
2021-02-23 12:43:51
330
3
原创 vue + elementui 采坑实录
elementui 组件中样式修改不生效 解决方案:去除scope 属性,添加唯一标识类,防止全局污染 全局文件(在main.js 中引入的文件)中添加<style lang="scss">.more-dialog { .el-dialog__title{ font-size: 14px !important; }}</style><style lang="scss" scoped>.el-table { background-
2020-12-17 14:09:17
2026
1
原创 Vscode 如何利用FTP上传文件?
安装扩展 SFTP(支持FTP和sftp协议)按下F1调出命令,输入sftp.config,调整ftp配置,参考内容:{ "name": "10.20.1.135", "host": "10.20.1.135", "protocol": "sftp", "port": 22, "username": "root", "remotePath": "/root/", "uploadOnSave": true, "connectTime
2020-10-20 11:30:31
2664
原创 vue 自省知识点——mixin 相关
对vue的mixin我们在项目中经常使用,用于处理一些复用功能。关于mixin,官方是这么描述的:混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。官方地址:vue 混入(mixin)这里记录一下mixin 的一些知识点执行顺序...
2020-09-30 14:04:19
347
原创 vue 自省知识点——生命周期
生命周期我们普遍了解的的有8个生命周期,beforeCreate,created ,beforeMount, mounted, beforeUpdate,updated, beforeDestroy,destroyed下图阐述了一些相关知识点当看完上面的内容,你可能就觉得自己明白了vue生命周期了,那么可以试着回答下面几个问题(答案放在文章最后):你知道computed 事件发生在哪个生命周期吗?会对页面有什么影响? 我们知道watch 对象键值中,immediate如果为true 代
2020-09-29 17:23:33
328
原创 node 读取文件夹下的所有内容并存到一个文件
目的:读取一个文件夹下的所有内容(我这里是*.properties 格式文件),合并到一个文件中(例如:data.js)var fs = require('fs');var path = require('path');var os = require('os');var readline = require('readline');// 读原本的文件function fileDisplay(filePath){ console.log('——————开始读i18n————————
2020-09-28 20:13:39
1372
1
原创 VSCODE 配置eslint规则和自动修复
全局安装eslint打开终端,运行npm install eslint -g全局安装ESLint。vscode安装插件vscode 扩展设置依次点击文件 > 首选项 > 设置{ "workbench.iconTheme": "material-icon-theme", "explorer.confirmDragAndDrop": false, "explorer.confirmDelete": false, //配置eslint "es...
2020-09-28 14:47:55
9241
原创 elementui 国际化分模块引入
以上就是我们常用的国家化过程,但是如果国际化内容很多,翻译内容全部存放在zh.js 和 en.js 中就会产生一些问题,所以我们就想到将翻译区分开,得到一个公用的翻译内容 和 各页面各自对应的翻译内容
2020-09-28 11:28:55
631
原创 通过js 检测url链接是否有效(含跨域)
letcheckUrl = function (url) { return new Promise(function (resolve, reject) { $.ajax({ url: url, type: 'GET', dataType: "jsonp", //跨域采用jsonp方式 complete: (response)=> { if(response.status==200) resolve(tru
2020-08-07 17:29:48
2014
原创 cockpit 前端
背景:最近公司要基于cockpit,来定制自己的一个服务器管理web 应用。嗯。。cockpit是啥?能干嘛?我要拿它干嘛?如你所见,我此刻是懵逼的。cockpit 了解我熟练的打开了百度又打开了bing哦吼,二度懵逼。经过几番了解,大概是知道了Linux Cockpit 是一个基于 Web 界面的应用,它提供了对系统的图形化管理。因为功能集成,对服务器管理来说,可以称得上是神器,深受linux 开发者的喜爱。(呵呵。。)最后我大概是知道了,公司就是想让我在人..
2020-06-19 15:21:32
4796
3
原创 wordpress建站,新手可看(一)
一、前端引入自定义js、css首先准备自己的js和css文件,文件放在 根目录 > wp-content > plugins 下,我这里准备的文件名称分别是plugin_stylesheet.css 和 plugin_script.js找到 根目录 > wp-includes> function.php在文件的最下面分别引入以下两段代码就好了。//引入...
2020-06-17 11:30:50
245
原创 gulp4 babel browserify
参考地址 : https://www.jianshu.com/p/fbc65e2cdeb8如何使用es6模块化?使用起来其实非常简单在 module1.js 中var hello = 'hello world !';function sayHello(){ console.log('hello dear !')}export {hello,sayHello} //对外暴露在 main.js 中// 在引入的时候使用es6的对象的解构赋值import {hel
2020-06-12 16:27:06
926
1
原创 考勤名单node统计
名单内容如下:const xlsx = require("node-xlsx"), fs = require('fs'), excelData = xlsx.parse("name.xlsx"); let meth = { /* arr 数据转格式 [ [ '全部人员名单', 3.16, 3.16 ], [...
2020-04-01 16:18:37
293
原创 小程序 getBackgroundAudioManager
小程序弃用了audio组件,转而提供了2种音频播放的方式 :createInnerAudioContext 和 getBackgroundAudioManager所区别的是:backgroundAudioManager 是 全局唯一的背景音频管理器如果需要音乐类似QQ音乐那样,小程序在后台时,仍然在播放音乐 请使用 getBackgroundAudioManager 否则应该 使用普通音频A...
2020-03-30 14:28:20
3103
原创 rem 的几种使用方式
media 的使用html { font-size: 16px;}@media screen and (min-width: 375px) { html { /* iPhone6的375px尺寸作为16px基准,414px正好18px大小, 600 20px */ font-size: calc(100% + 2 * (100vw - 375...
2020-03-23 13:00:21
568
原创 小程序引入字体注意点
小程序引入字体有2种方式,第一种是通过 @font-face ,第二种是通过小程序提供的方法 loadFontFace。引入的方式不同但是需要注意的地方大致形同:官方提出了以下的注意事项字体文件返回的 contet-type 参考 font,格式不正确时会解析失败。字体链接必须是https(ios不支持http)字体链接必须是同源下的,或开启了cors支持,小程序的域名是servic...
2020-03-02 19:49:30
2369
原创 前端常用的 59 个工具类
前端开发有时会处理一部分后台返回的数据,或者根据数据判断做一些处理;这个时候就非常有必要将一些常用的工具类封装起来;转自 : https://juejin.im/post/5de5be53f265da05c33fcbb4...
2019-12-03 15:03:37
704
原创 html 邮件注意事项
最近需要发送html 格式的邮件,因为使用的是outlook,新版的outlook不支持html编辑,只能把页面内容拷贝到邮件里。发送后其他邮箱下查看邮件样式就会错乱,这里记录下趟的坑,以及代码开发的注意点。1. 声明目前,兼容性最好的Doctype是XHTML 1.0 Strict,事实上Gmail和Hotmail会删掉你的Doctype,换上这个Doctype。<!DOCTYPE ...
2019-11-22 11:18:42
996
原创 vscode react jsx 中标签自动补全
设置中搜索 includeLanguages进入到用户设置,点击settings.json中编辑以下内容{ "emmet.triggerExpansionOnTab": true, "emmet.includeLanguages": { "javascript": "javascriptreact" }}...
2019-11-14 14:53:04
365
原创 H5页面底部前进、后退横栏怎么去除?
最近在写h5 的时候要求去掉页面的前进和后退的横栏,记录一下自己的解决方案。1. 首先说明一下h5的流程前端调起h5 授权 > 用code 从服务器换取token > 记录下token,之后的每次请求带上token2. 发生问题的原因每次h5授权的时候,微信会重定向,这时候我们的页面就会带上这个前进和后退的横栏。3. 怎么解决我的想法是如果重定向不发生在前端页面而是在后台...
2019-10-24 14:18:58
3730
1
原创 Backbone 的使用 (五)—— View 篇
一、渲染模板<body> <div id="search_container"></div> <script type="text/template" id="search_template"> <label><%= search_label %></label> ...
2019-10-18 10:58:24
265
原创 Backbone 的使用 (四)—— Route 篇
这里其实和我们熟悉的路由大同小异,也是利用hash 来操作。看下面这个例子var AppRouter = Backbone.Router.extend({ routes : { '' : 'main', 'topic' : 'renderList', 'topic/:id' : 'renderDetail', ...
2019-10-17 14:48:44
305
原创 Backbone 的使用 (三)—— Collections 篇
如果将一个Model对象比喻成数据库中的一条记录,那么Collection就是一张数据表。它表示为一个模型集合类,用于存储和管理一系列相同类型的模型对象。举个简单的例子: // 定义模型类 var Book = Backbone.Model.extend(); // 定义集合类 var BookList = Backbone.Collection.ext...
2019-10-17 14:25:07
244
原创 Backbone 的使用 (二)—— Mode 篇
我们将通过一个一个小实例来逐步学习Mode首先定义一下整体的页面结构 <!DOCTYPE html> <html> <head> <title></title> </head> <body> </body> <script type="text/javascript" ...
2019-10-12 14:05:01
455
原创 Backbone 的使用(一)
题外话:最近想学习backbone,发现中文的教程并不是很多,看到很多博客内容相似度99%,大多数应该都是“借鉴”的同一篇文章下面记录下个人的理解,如有问题欢迎指正为了方便阅读(就是懒)下面的Backbone 用简称bab 代替参考博客:Backbone之旅官方网站Backbone入门指南建议按以上顺序学习一、什么时候用?构建大型、复杂的单页面应用bab 是再合适不...
2019-10-11 16:06:32
1095
elementui 表格行合并后,再次请求数据,界面错乱
2022-04-07
qq 邮箱是如何记住用户名和密码的尼?
2021-04-09
js 如何实现掩码数字转ip尼
2021-04-01
js 如何截取地址格式的字符串?
2021-03-16
将正则放在循环里面和外面,得到的结果为什么不一样?
2020-12-27
TA创建的收藏夹 TA关注的收藏夹
TA关注的人