smallNut的博客

今天写一个日期选择框联动的需求，本来是想使用range的，但是range在具体使用上有诸多不便，于是便将两个日期选择框进行独立联动，在传值时将两个值再按照自己想要的格式进行传递这里我的写的是开始和结束年份保持在一年的例子(其他需求亦可以此为变种进行编写)这里的话需要用到一个非常好用的时间处理插件moment，安装的话直接使用npm i moment下载即可引用:import moment from 'moment'html <nz-year-picker nzFormat="yyy

在配置angular路由的时候可能会遇到这样的问题，我们在将子页面引入其父页面，通过父页面路由去访问它的时候，配置如下

相同点字符串方法String.substr 与 String.substring 都是从目标字符串上截取部分字符串的方法不同点写法：String.substr() 第一个参数是代表从哪个索引开始截取(包含此索引元素)，第二个参数是截取的长度，返回被截取的字符串，不改变原字符串长度const str = '0123456789'; // 直接量创建字符串console.log(str.substr(2)); // 23456789 只写入一个参数默认截取索引往后的所有字符console.lo

相同点Object.prototype.isPrototypeOf 与 instanceof 都是判断目标对象是否在另一个对象的原型链上的方法，都会在另一个对象的原型链上往上查找不同点写法：Object.prototype.isPrototypeOf()function foo(){} // 定义函数foo.prototype = { a: 1}; // 编辑函数的原型对象let con = new foo(); // 创建对象实例console.log(con.a);//打印的是1，

相同点：hasOwnProperty，propertyIsEnumerable和isPrototypeOf都是用来判断目标属性是否为该对象的属性(不包括从原型链上继承的属性)目标对象：object 目标属性：targetAttribute不同点：1.hasOwnProperty遍历的是目标对象自身可遍历的属性用法：object.hasOwnProperty(targetAttribute) 判断属性是否存在于当前对象上，返回一个boolean类型值，存在为true，否则false2.prop

节流与防抖，这两个词经常会出现在前端的应用中，很多时候我们只是该用的时候使用它，往往却不喜欢花时间理解亦或者是看到的逻辑较复杂，一时间无法记住重要的导致全部都被大脑清除掉了，所以我留下这个既不需要大费周章去理解，而简单看看就能很容易理解的记录什么是节流与防抖？节流：立即触发一次事件，在事件触发后的一段时间内再次触发事件不执行并且会将时间重置 let box = document.getElementById('box'); // 获取需要进行操作的dom元素 // 将d

JS的运行机制先来一个今日头条的面试题async function async1() { console.log('async1 start'); await async2(); console.log('async1 end');}async function async2() { console.log('async2');}console.log('script start');setTimeout(function() { console.l

今天在写需求的时候遇到一个要将表格的滚动条在进行路由跳转时固定的操作，然后没想到居然在scrollTop这个属性的设置上栽了坑，关于此问题的原因网络上的解释也五花八门，各不相同这里我们以下图demo为例，给大家解释一下设置scrollTop属性设置无效可能会遇到的几个原因1.父，子元素需设置高度，并且子元素高度必须大于父元素这一点应该很好理解，如果子元素高度始终小于父元素，那么无论怎么设置scrollTop的值都不可能大于02.父元素需设置overflow: scroll 或 overflow-y：

今天使用angular引用子模块时发生了这样一个错误本来以为是引入方式的问题，结果反复检查module中的写法也没发现问题，百思不得其解的状况下发现这种报错和引入方式报错还有些不一样，后来发现是自己ngswitch的写法有问题上图两种写法都不会报错，并且都有自动补全，但是只有第一种写法是正确的，第二种写法的指令并不存在与angular的内置指令中，于是便会抛出如上的错误，希望能够帮到遇到相同问题的小伙伴...

今天在切换svn分支时提示了这个错误，然后仔细检查发现是自己当前选中的文件夹与想切换至的文件夹层级不同，比如当前即将切换至的文件夹的下一级就是存放依赖包的地方，而当前选中的文件夹的下一级却不是则会出现此错误，将切换与被切换两者文件夹相对应好即可...

1.ng-contentng-content的作用是内容投影，主要用法是在父组件中将html投影到子组件中，具体写法如下父组件html<app-zippy-basic> <p>Is content projection cool?</p></app-zippy-basic>子组件tsimport { Component } from '@angular/core';@Component({ selector: 'app-zippy-b

今天刚好要使用双轴形式的echarts做图表，但是由于数据过多需要同时使用echarts的伸缩配置datazoom，但是问题是配置写完后发现只有一条x轴和数据会试用到伸缩配置后来研究了一下发现datazoom相关配置需要与x轴进行相同配置这是双x的配置写法series: [ { name: '选择日期', type: 'line', xAxisIndex: 0, smooth: true, data: []

今天在debug的时候发现一个令人匪夷所思的问题，即在当前路由下打开echart图表后其正常显示切换路由后切换回去检查了一遍排除了样式污染的可能，切换的路由也未载入echart(原因不详)解决方案：无意中发现窗口变动时图形会恢复正常所以我们可以说使用自定义触发窗口变更的方法（写在echart图形配置附近即可）window.dispatchEvent(new Event(‘resize’))...

Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: The provided value is not of type ‘(CSSImageValue or HTMLCanvasElement or HTMLImageElement or HTMLVideoElement or ImageBitmap or OffscreenCanvas or SVGImageElement or VideoFrame)’今天用canvas画布渲染图片

今天在打包项目部署到线上的时候发现直接访问可以，但是刷新后页面会404，后来明白可以通过hash模式去配置路由使其每次刷新都停留在当前页面，具体配置如下在app.routing.module.ts中配置providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],解决方案参考至https://www.w3cways.com/2115.html...

我这边接到的需求是做一个轮盘，点击上半区时顺时针旋转，点击下半区时逆时针旋转，每次点击都将其旋转到相同位置，具体效果如下由于逻辑代码是自己一点一点研究出来的，为了避免资源的浪费，仅供真正有需要的人去获取...

今天突然发现csdn无法上传本地视频，但是可以上传gif文件，百度搜索的时候找的工具大都需要收费，于是自己便去寻找了一下向大家免费分享一款比较好用的git生成工具 LICEcap链接: https://pan.baidu.com/s/1n4RcN4wnXelPJfDmSSr8eg提取码: 5mer安装的话也很便捷，一路点击确定就行了使用的话点击此处然后选择文件保存位置停止的话点击旁边的stop键就可以了这是我录制的demo效果希望能够帮到有需要的人...

今天在写项目的时候遇到一个问题，在路由跳转的过程中将一个对象传入跳转的参数中在接收的时候发现他已经变成[object Object]格式很明显是路由跳转的过程中自动将此对象参数转译成字符串了，后来我试着去使用JSON.parse将其转为对象，但是却报错由此可知其自动转译是使用toString方法进行转译的，其已经变为一个代码块，无法使用JSON.parse再转译回来所以遇到这种情况的时候我们需要根据实际情况进行相对应的处理如果是自己写的toString方法，可将其换成JSON.string