- 博客(50)
- 收藏
- 关注
RSS订阅原创 element日历插件获取显示的第一天和最后一天
这个日历插件右上角的按钮上个月下个月事件，切换后默认是那月1号，传入这个时间就可以重新获得切换后的月份的时间范围，用v-model绑定切换后的数据。已知星期排版是固定的，第一天是星期天，最后一天是星期六。通过当月1号和最后一天再往前推算需要展示上个月几天，和下个月几天。需求是要传入当前显示的第一天和最后一天来获取范围，再判断某个日期是否有内容标记。watch监听变动来做事件。
2023-09-22 11:10:05
753
原创 vue使用websocket
在登录和退出的时候进行websocket进行建立连接和关闭连接。建立websocket.js。在需要用到websocket使用。
2023-08-21 11:24:05
597
原创 css中offset应用动效
用svg算出圆形path("M${width},${width/2}m-0,0a-${width/2},-${width/2}01,0-${width},0a${width/2},${width/2}01,0${width},0")如图所示，圆圈绕着转圈，本来可以用相对定位，但奈何要做成圆圈数量不固定，那就意味位置不能固定，需要计算。由于轨迹是个圆圈，紧贴着圆圈偏移，小圆整个模块会旋转，所以需要额外加transform转正。width为绕圈的宽度。...
2022-07-20 17:43:47
641
原创 解决npm发布文件过大的问题
npm发布文件过大在package.json里配置需要上传到远程仓库的文件即可 "files": [ "dist" ]
2022-03-23 13:51:21
2027
原创 npm run build 报错
[email protected] build D:\test\map-plugin> cross-env NODE_ENV=production webpack --display-error-details --config webpack.config.js'cross-env' ▒▒▒▒▒ڲ▒▒▒▒ⲿ▒▒▒Ҳ▒▒▒ǿ▒▒▒▒еij▒▒▒▒▒▒▒▒▒▒▒▒ļ▒▒▒npm ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! map-plugin..
2022-01-12 14:07:06
896
原创 使用requestAnimationFrame分页渲染
使用requestAnimationFrame代替setTimeout，减少了重排的次数，极大提高了性能。 renderList(list) { let renderTreeData = []; const total = list.length; const page = 0; const limit = 100; const totalPage = Math.ceil(total / limit); const rende
2021-12-29 14:35:25
525
原创 element表格多行合计
<el-table :data="tableData" border row-key="id" default-expand-all show-summary :summary-method="getSummaries" :tree-props="{ children: 'children' }" > .
2021-06-25 16:22:38
3394
1
原创 开启一个本地服务
第一种方式1.安装Debugger for Chrome插件2.使用ctrl+`快捷键打开终端，然后输入npm install -g live-server3.在命令行里输入 live-server即可第二种方式在写前端页面中，经常会在浏览器运行HTML页面，从本地文件夹中直接打开的一般都是file协议，当代码中存在http或https的链接时，HTML页面就无法正常打开，为了解决这种情况，需要在在本地开启一个本地的服务器。 本文是利用node.js中的http-server，开..
2021-06-25 10:16:51
1267
原创 作用域
作用域是可访问变量，对象，函数的集合。（即某些特定部分中变量，函数和对象的可访问性。）作用域最大的用处就是隔离变量，不同作用域下同名变量不会有冲突，不会被外泄和暴露，不会污染到外面，不会对其他的库或者JS脚本造成影响变量生命周期：局部变量在函数执行完毕后销毁。全局变量在页面关闭后销毁。局部作用域：在函数内声明var name="global";if(true){ var name="local"; console.log(name)...
2021-05-15 22:54:15
201
async-validator笔记
官网的示例methods: { submitForm(formName) { this.$refs[formName].validate((valid) => { if (valid) { alert('submit!'); } else { console.log('error submit!!'); return false; }
2021-01-06 11:11:51
1342
原创 umy-ui虚拟表格中的表单验证
首先，umy版本需要更新到最新版，目前是1.1.4。html模块：ux-grid表格头部增加rule，:rules="rules"和自动聚焦:validConfig="{autoPos:true}"；ux-table-column增加自动聚焦:edit-render="{autofocus:'.el-input__inner'}"；<ux-grid border show-overflow ref="plxTable" keep-source ..
2020-11-26 09:50:30
1879
1
原创 vue清除定时器
const timer = setInterval(() =>{ // 某些定时器操作 }, 500); // 通过$once来监听定时器，在beforeDestroy钩子可以被清除。this.$once('hook:beforeDestroy', () => { clearInterval(timer); .
2020-11-20 10:10:15
168
原创 JS十六进制颜色转换RGBA
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>..
2020-06-18 10:22:04
2243
原创 VUE里的rules验证方法调用this数据
rules在data里不能调用本页自己创建的数据或事件，但可以获取到页面全局带$的数据rules:{identifiercode:[{required:this.$route.params.type!='details',message:'服务资源标识符为必填项！',trigger:'blur'}], verson:[{required:this.$route.params.type!='details',message:'请输入版本号',tri...
2020-05-25 16:43:31
2981
原创 Flex左右布局，高度相等自适应
css://body高度要撑开html,body{ min-height: 100%; height: 100vh;}//父级.box-fix{ min-height: 100%; display: flex; justify-content: space-between;}子级.main-left{ width: 210px; flex: 0 0 ...
2020-03-20 14:37:32
14751
原创 vue中全局绑定一个键盘事件
全局绑定一个事件：export default { install(Vue, options) { //全局回车键搜索 Vue.prototype.keyEnter = function (vm,functionname,type) { document.onkeydown = function(e) { ...
2019-09-29 14:23:03
1633
原创 ES2019的新内容
Array.flat（）递归地将嵌套数组展平到指定的深度。默认值为1const arr1 = [1, 2, [3, 4]];arr1.flat(); // [1, 2, 3, 4]const arr2 = [1, 2, [3, 4, [5, 6]]];arr2.flat(2); // [1, 2, 3, 4, 5, 6]//全深度使用const arr3 = [1, 2, [...
2019-08-09 17:30:29
420
原创 html中video在全屏时再打开声音
//全屏打开声音 $(window).on('resize',function(e){ var explorer = window.navigator.userAgent.toLowerCase(); if(explorer.indexOf('chrome')&...
2019-08-02 13:46:10
1607
原创 ivew的render中select数据绑定
render:(h,param)=>{ return h('Select', { props:{ value: this.formItem.RegistTemplate, }, on: { 'on-change':(event) => { ...
2019-03-13 10:44:28
564
原创 js实现document.ready
(function () { var ie = !!(window.attachEvent && !window.opera); var wk = /webkit\/(\d+)/i.test(navigator.userAgent) && (RegExp.$1 < 525); var fn = []; var run = function (...
2019-02-15 11:06:19
3010
原创 js批量删除微博教程
第一步也是最关键的一步，先搜索出所有带关键字的微博，不然的话就是全部微博删除了，慎重！第二步：右击选择审查元素（mac是检查）或者F12，调出后台工具，点击console，将以下代码复制进去，直接回车即可。 如果有下一页可的话需要重复一下第二步再粘贴一遍到console重新启动一下。源码如下： var s = document.createElement('scri...
2019-01-03 17:37:33
2788
1
原创 动态修改echarts的容器大小
document.getElementById('main').style.height = height+'px'sideBarChart.resize();//直接加这句即可sideBarChart.setOption(sideBarOption,true);
2018-08-06 11:38:42
10146
7
原创 js微博自动转发——小笼包专用教程贴
1、打开要转发的微博的页面，右击空白处找到“审查元素”或者“检查”调出控制台；选择network；2、当前页正常转发一次，会得到一个forward文件，单击打开，选择header复制url、mid、location、pdetall这四个数据到一边3、点击console，将以下源码放到空白处，将以下四个数据改成刚才复制的你的id信息更改引号里转发内容为要转发的文...
2018-08-02 11:18:48
6125
9
原创 js判断字符串出现最多的字符，并统计次数
function countStr(str){ var obj = {}; for(var i = 0, l = str.length,k; i < l ;i++){ k = str.charAt(i); if(obj[k]){ obj[k]++; }el...
2018-07-25 15:17:15
1299
原创 随机产生颜色
function randomVal(val){ return Math.floor(Math.random()*(val + 1)); } function randomColor(){ return 'rgb(' + randomVal(255) + ',' + randomVal(255) + ',' + randomVal(255...
2018-07-25 14:39:18
1442
原创 适用pc和wap的阻止遮罩层背景滚动
var bodyEl = document.bodyvar top = 0function stopBodyScroll (isFixed) { if (isFixed) { top = window.scrollY bodyEl.style.position = 'fixed' bodyEl.style.top = -top + 'px' } else ...
2018-07-23 11:49:49
347
原创 jq创建当前时间的前半年日期
var oyear = o.getFullYear();var omonth = o.getMonth()+1;var oday = o.getDate();var date = []setTimeout(function(){ //判断半年前是否今年 //不是今年 if (year!=oyear) { monthFn(oyear,omonth,oday) for (var ...
2018-06-29 15:36:58
1121
1
原创 margin-bottom在safari浏览器失效的问题
今天遇到一个bug是底部明明有margin-bottom却无法作用，排查了一下改成用padding可以有效但不找出原因是无法完成这篇博客的问题概要描述：在safari中，当内容高度超出所有父容器时，内容的margin-bottom设置是无效的。解决这个问题的办法也很简单，只要规避这种超出所有父容器的内容即可。父容器不设置高度即可。另外尽量少用html, body {height: 100%;}这种...
2018-03-28 11:01:42
3115
1
原创 用reduce（）找出字符串最长不重复片段
function lengthOfLongestSubstring(s) { const map = {}; var left = 0; return s.split('').reduce((max, v, i) => { left = map[v] >= left ? map[v] + 1 : left; map[v] = i;
2018-01-17 14:36:09
270
2
转载 移动端浮层内滚动窗体不滚动的JS处理
var elButton = $('#button'), elButtonWith = $('#buttonWith');var elAside = $('#aside');elButton.on('click', function () { elAside.addClass('active'); $('html').addClass('noscroll');});elButtonWi
2018-01-08 13:32:33
480
转载 vue表单验证组件 v-verify-plugin
vue表单验证组件 v-verify-pluginverifygithub:https://github.com/liuyinglong/verifynpm:https://www.npmjs.com/package/vue-verify-plugininstallnpm install vue-verify-pluginusehtml
2018-01-05 09:02:28
1155
转载 详解head头标签元素的意义以及使用场景
HTML头部分的标签、元素有很多，涉及到浏览器对网页的渲染，SEO 等等，而各个浏览器内核以及各个国内浏览器厂商都有些自己的标签元素,这就造成了很多差异性。移动互联网时代，head 头部结构，移动端的 meta 元素，显得更为重要。了解每个标签的意义，写出满足自己需求的 head 头标签，是本文的目的。本篇以一丝的文章为基础，进行扩展总结介绍常用的 head 中各个标签、元素的意义以及使用
2018-01-04 10:08:25
229
原创 flex兼容
.box{ display: -webkit-flex; /* 新版本语法: Chrome 21+ */ display: flex; /* 新版本语法: Opera 12.1, Firefox 22+ */ display: -webkit-box; /* 老版本语法: Safari, iOS, Android browser, older We
2017-12-22 17:25:00
211
原创 针对特定浏览器起作用的CSS: IE Chrome Firefox CSS Hack
Firefox@-moz-document url-prefix() { .cssSelector { font-size: 14px; }}Chrome@media screen and (-webkit-min-device-pixel-ratio:0) { #test1{color:red;}}IE6/7/8/9+
2017-12-08 17:40:16
708
原创 angular的scope.$last作用
angular在ng-repeat后的状态可用$last获取{{item.str}}.directive('repeatFinish',function(){ return { link: function(scope,element,attr){ console.log(scope.$index) if(scope.
2017-11-23 10:19:16
2127
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人