前端
文章平均质量分 81
@带甜味的盐@
我说随便写写,你信吗!
展开
-
JavaScript启动本地应用程序
在浏览器中通过JavaScript调起本地应用程序的一个可行方法就是通过协议调起。确定协议的方法要去注册表中看。原创 2023-11-23 17:23:50 · 2048 阅读 · 0 评论 -
Javascript模块引入方式
原生JavaScript中使用import组织项目模块。原创 2023-08-10 10:43:08 · 1348 阅读 · 0 评论 -
Vue3中配置environment
vue3中 配置+使用 environment原创 2023-08-08 11:07:51 · 948 阅读 · 0 评论 -
Error cannot find module ‘custom-electron-titlebarmain‘
angular-electron build之后运行时提示无法找到custom-electron-titlebar/main 错误解决方案原创 2022-12-13 12:44:01 · 913 阅读 · 1 评论 -
angular-electron集成rxdb数据库
Angular-Electron继承前端运行时数据库Rxdb。本文使用基于nodejs的leveldown存储方案。原创 2022-12-07 14:36:49 · 640 阅读 · 0 评论 -
为AntDesign的Table组件(树形数据)添加Checkbox(NG-ZORRO)
为AntDesign的Table组件(树形数据)添加Checkbox(NG-ZORRO)原创 2022-11-09 09:52:04 · 1736 阅读 · 0 评论 -
原生js预览ofd文件
原生js怎么预览ofd文件?这是一个可行的方法。原创 2022-10-27 09:42:29 · 4952 阅读 · 4 评论 -
自定义Scrollbar样式-封装复用
我们现在做一个项目不可能说每个出现滚动条的地方,我们都去把自定义好的样式重新再写一遍。于是,就出现了样式的封装和复用。在现在前端框架流行的时代,CSS的预编译框架mixin当然了,如果只是写个mixin,然后把样式写进去,好像也没啥新意,怎么玩呢?接下来我就给大家说一下我在写项目时,简单封装过的一个使用scss封装的scrollbar的mixin。也不算多高级,有想法的朋友也可以在此基础上继续扩展,小生献丑了。原创 2022-10-24 14:47:06 · 1223 阅读 · 0 评论 -
Angualr-Library笔记
angualr-library笔记原创 2022-07-29 14:14:00 · 514 阅读 · 0 评论 -
table多行表头渲染时出现位置错乱问题
若你也是表格跨行跨列在动态渲染时出现的表头位置错乱问题,可以直接看`PartThree`。原创 2022-06-23 14:55:34 · 654 阅读 · 0 评论 -
Electron自定义软件卸载流程
@此文章为问题解决方案记录@我碰到一个问题,我的单机程序集成了一个本地数据库,存放本地数据库文件的文件夹存放在用户的也就 这个文件夹中。😂😂所以,问题就来了,我发现,我卸载了这个程序,重新安装之后,程序竟然还能读取到我之前存储的数据,有点不符合逻辑。可是,我在的配置中已经配置了:注:我这里说的指的是的打包配置,不同框架之间配置的地方不同,比如: 和 的配置地方就不一样。所以,为什么呢?我去看了一下人家electron-build官网的解释,并结合卸载流程来看,原来本身卸载时只管删除程序安装数据文件夹,..原创 2022-06-08 15:28:07 · 6718 阅读 · 19 评论 -
electron下载失败_解决方案汇总
文章目录electron下载失败_解决方案汇总`node install.js` 出错`RequestError: connect ETIMEDOUT 20.205.243.166:443``RequestError: read ECONNRESET`electron下载失败_解决方案汇总嗯,怎么说!npm下载electron的时候经常会碰到下载失败的问题,我也很头疼,网上的方法也试过很多,这里就汇总一下。如果再有下载失败的问题出现,那么,就按照方法一个个测试吧。说实话,有个测试的目标在,总原创 2022-03-11 16:07:22 · 7591 阅读 · 2 评论 -
ng-content的select属性绑定的值不起作用
ng-content内容投影是干什么的,引用官网中的一句话:内容投影是一种模式,你可以在其中插入或投影要在另一个组件中使用的内容。例如,你可能有一个Card组件,它可以接受另一个组件提供的内容。原创 2022-03-04 10:28:38 · 718 阅读 · 0 评论 -
Angualr中如何引入 · 原生js · 文件
Angualr中如何引入 · 原生js · 文件这里算是一个记录吧,我从网上看了一点别人的关于这方面解释的文章:有些文章写的不太对头。有些文章写的还是 Angualr 1 的东西。有些文章写的有些麻烦,改这个,改那个,看了不太对劲。这里记录一下我成功的方法,用的是 AngualrCLI 版本 v12,也并没有出现 奇奇怪怪的编译不通过这啊那啊 的问题。先贴一下我的tsconfig.json:{ "compileOnSave": false, "compilerOptions":原创 2022-01-27 16:11:47 · 1529 阅读 · 0 评论 -
AngularCli主题切换
AngularCli主题切换首先要说明的是,这是基于Angualr的一个主题切换策略,不附加任何UI框架的主题系统.经常使用Angular的小伙伴应该都了解,Angular和Scss结合的很好,所以这篇Angular的主题切换策略,也主要以Scss预处理器来做。我这里使用的AngualrCli的版本为12,还是比较新的。这篇策略可以向下兼容,这个不用担心。这个策略在其他以scss为预处理器的项目中好像也能实现。实现效果图:自定义主题由于不附加任何UI框架的主题系统,所以要实现原创 2021-12-15 12:22:24 · 1674 阅读 · 0 评论 -
js获取用户选择的文件路径[曲线救国]
JavaScript如何获取用户input[type=file]选择的文件路径呢?首先,JavaScript本身是无法通过input[type=file]获取用户选择的文件路径的,这条路是行不通的。有经验的都知道,这样获取到的路径是 C:/fakepath/...一类的路径。所以,那我们还有办法通过input[type=file]获取文件的路径吗?答案:有写一个C++去调用系统底层的一些东西,然后交给JavaScript调用这个C++文件曲线救国C++,我…不会写,所以还是看一下曲线救原创 2021-11-22 18:19:03 · 12492 阅读 · 6 评论 -
JS 中 new Date() 踩坑记录
JS 中 new Date() 踩坑记录序言:这个问题,我也是无意间碰到了,我其实也没想到会出现这种情况,废话不多说,看问题。new Date()不用多说吧,身为一个前端程序员,应该都知道。new Date(d)可以传一个特定的日期 d ,然后 new Date()会帮我们把传入的日期转换成一个 时间戳。> new Date('2021/10/01')>> Fri Oct 01 2021 00:00:00 GMT+0800 (中国标准时间)OK,接下里,我提出一个原创 2021-09-30 14:54:36 · 4083 阅读 · 1 评论 -
angular-electron 将打包后的.exe程序从“一键安装”改为“辅助安装”
将angular-electron的打包后的exe程序 从一键安装程序 改为 辅助安装程序我用的 angular-electron 版本 10.1.0前言:我搞这个的时候,也搞了很长时间,而搞很长和时间的原因,是因为,我搜索出来的关于改变这个安装程序的配置都是要写在package.json里。。。。说实话,当时我就信了他们的话,但是我忽略了一点,我用的是 angular-electron,人家带的有自己的 electron-build.json文件。。。。我里个大尴尬,浪费我两个小时的时间。。原创 2021-08-26 10:08:18 · 527 阅读 · 2 评论 -
简单实现Vue中的响应式对象
简单实现Vue中的响应式对象传送门:简单实现Vue中的虚拟domVue中的响应式对象,这是一个耳熟能详的话题了,其实一说起这个,尤其是面试官一问起,那通用套路肯定是要先说一句:Vue使用Object.defineProperty对对象进行了拦截处理。没得错,我们今天要简单实现响应式对象,那肯定也是逃不开这个Object.defineProperty的。接下来,我们就先简单的看一下这个 Object.defineProperty:Object.defineProperty方法会直接在一个对象上原创 2021-08-21 17:28:55 · 1006 阅读 · 2 评论 -
简单实现Vue中的插值替换(三)
简单实现Vue中的插值替换(三)传送门:简单实现Vue中的插值替换(二)这(三)的内容,大家可以当做对(二)的补充,主要就是为了解决,多级对象的访问问题。OK,咱们正式开始。首先我们还是来简简单单的说一下这个问题。咱们定义一个对象,对象的层级是不确定的,就比如:data = { a: { b: { c: { d: '这是要获取的值' } } }}既然如此,那如何原创 2021-08-21 17:23:04 · 681 阅读 · 1 评论 -
简单实现Vue中的虚拟dom
简单实现Vue中的虚拟dom前言:要想简单实现虚拟dom,首先我们要了解虚拟dom,知道自己要实现的是个什么东西。说起来,我刚开始学习Vue的时候对虚拟dom也是一知半解,我当时一听虚拟dom,脑子里第一反应就是虚拟机 ,不因为什么,就因为它两个都带有虚拟这个词。虚拟什么意思?虚拟:设想、虚构。说的更直白一点,就是凭想象编造出来的事物。既然是虚拟出来的,那虚拟出来了个啥呢,或者说Vue根据真实的dom编造出来了一个什么样的东西呢?其实,简单的理解虚拟dom,就是Vue用对象式的语言原创 2021-06-26 18:48:36 · 843 阅读 · 4 评论 -
简单实现Vue中的插值替换(二)
简单实现Vue中的插值替换(二)传送门:简单实现Vue中的插值替换(一)在上一篇博客中,我们简简单单的梳理了一下,如何把一个插值表达式替换成对象里面真正的数据,但是呢,美中不足的地方也有很多,这次呢,我们从两个方面入手,简简单单的完善之前的代码。方面一:仿造Vue的数据源方面二:代码结构上仿造Vue简单的聊一下方面一:首先我们知道,我们在Vue中写数据源一般是这么写的: let app = new Vue({ el: '#root', data: {原创 2021-06-12 21:56:13 · 661 阅读 · 3 评论 -
简单实现Vue中的插值替换(一)
简单实现Vue中的插值替换功能这篇博客,我们简简单单的实现一下Vue中插值替换的功能。当然,功能肯定是简化简化再简化的了,只有这样才能称为——简简单单 0^0。正片开始:要点解释:0v0首先我们要知道什么插值替换,这个想必学过Vue的都知道,这里就简单说一下:<body> <div id="root"> <p>{{name}} - {{message}}</p> <p>{{name}}<原创 2021-05-16 19:01:45 · 1560 阅读 · 2 评论 -
angular路由动画配置
Angular 路由动画配置好记性不如烂笔头,这里记录一下如何配置一个简单的Angular router animate正片开始第一步:要在app.module.ts引入动画模块import { BrowserAnimationsModule } from '@angular/platform-browser/animations';imports: [ BrowserAnimationsModule, ...]第二步:创建一个文件,这个文件里专门用来设置我们设置的动画效果原创 2021-02-23 17:11:33 · 370 阅读 · 0 评论 -
Git提交代码完整流程
重中之重——先拉代码每次提交代码之前,养成良好的习惯,先 pull 一下代码。不 pull 代码万一导致代码冲突了就不美了。命令: git pull接下来,就是正常流程了,现在的代码编辑器,例如:Visual studio code等,对 git 的支持已经很好了,我们只需要用鼠标 点点点 就能把代码提交上去。滴滴···废话警告:但是!身为一个优秀的 人与虚拟世界友好交互通信的奠基人员,焉能拘泥于鼠标 点点点?我们必须要对网络上那些能一秒敲千行代码的高人心存向往,再说了使用命令行不香吗?不原创 2021-01-11 13:25:50 · 53974 阅读 · 4 评论 -
Typescript中定义接口(interface)
文章目录接口的作用:设置接口可选属性:额外属性检查:设置接口只读属性:函数类型接口:可索引类型接口:接口的作用:接口,英文:interface,其作用可以简单的理解为:为我们的代码提供一种约定。在Typescript中是这么描述的:TypeScript的核心原则之一是对值所具有的结构进行类型检查。它有时被称做“鸭式辨型法”或“结构性子类型化”。在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。举个例子:// 定义接口 Personinterfac原创 2021-01-08 09:27:29 · 10660 阅读 · 2 评论 -
原生js实现bind call apply (二)
原生js模拟实现bind call apply上一章节,我们已经使用原生js模拟实现了 bind 操作。这一章节,我们就来实现一下 call 和 apply。首先,我们先简单来说一下call 和 apply:详细的请看JavaScript中的call()和apply()this.name = 81;var obj = { name: 'syw', getName: function (...params) { console.log(this.name, p原创 2020-12-17 10:55:41 · 151 阅读 · 2 评论 -
原生js实现bind,call,apply (一)
使用原生JavaScript模拟实现:bind call apply 。首先,这三者都是用来改变this指向的,相信大部分人对于bind的使用都不陌生,对于另外两个若有不懂的可以去看我的博客:JavaScript中的call()和apply()举个例子:this.name = 81;var obj = { name: 9, getName:function(){ console.log(this.name); }}obj.getName();// 输原创 2020-12-16 16:25:54 · 236 阅读 · 1 评论 -
js三行注释解析
文章目录示例注释解析abstractaccessaliasasyncaugmentsauthorborrowsclassclassdescconstantconstructscopyrightdefaultdeprecateddescriptionenumeventexampleexportsexternalfilefiresfunctiongeneratorglobalhideconstructorignoreimplementsinheritdocininstanceinterfacekindlends原创 2020-12-07 11:30:17 · 2273 阅读 · 1 评论 -
js判断图片的网络地址是否有效
判断图片的网络地址是否有效方法:利用 HTML DOM Image 对象Image 对象提供了两个事件,分别是:onerror & onload。用法如下:// new Image对象const IMG = new Image();// 设置路径IMG.src = yourImgPath;// 当图像装载完毕时调用的事件句柄IMG.onload = ()=>{ console.log('load事件加载');}// 在装载图像的过程中发生错误时调用的事件句柄IMG.o原创 2020-12-03 09:43:54 · 2869 阅读 · 0 评论 -
获取当前日期几天后的日期
一行代码搞定:// 获取当前日期 七天 后的日期const after = new Date().setDate(new Date().getDate() + 7);获取指定日期 几天后 的日期:// 例如 2020-11-30 七天 后的日期const after = new Date('2020-11-30').setDate(new Date('2020-11-30').getDate() + 7);注意:这样获取的结果都是一个时间戳。例如上面获取 2020-11-30 七天后得到原创 2020-12-01 10:40:08 · 1264 阅读 · 0 评论 -
nvm的安装与使用
前言:这几天做东西的时候又牵涉到node版本的切换了,记得自己随手记过一些nvm的常用命令,但是没有形成一个统一的文档,这里做一下总结并形成一个博客文档,以便以后查阅。什么是NVMNVM全称:Node Version ManagerNVM就是一个node版本管理器,用于管理多个活动的node.js版本。管理 Windows 下的 node,官方推荐使用nvmw或 nvm-windows本文使用:nvm-windowsNVM下载与安装下载地址:nvm-windows打开下载地址之后,.原创 2020-11-20 10:12:51 · 418 阅读 · 0 评论 -
Echarts绘制不均匀数据轴(y)
应用场景(以Echarts柱状图为例):现有一组数据:最小的数是 50000(5万) ,最大的数是 3000000000(30亿)。如果按照Echarts正常的画法,我们只需提取出来这些数据然后交给Echarts显示即可。但是这样做面临的问题就很明显——由于数值差距过大,且Echarts本身Y轴的数值是均匀分布的,所以在图里造成的结果是这样的:在图中,y 轴的数值均匀分布,最高的柱子在x轴 第五值为30亿,但是x轴 第一值为5万的柱子,根本看不见,因为差距太大了,包括x轴 第二值为500万的轴原创 2020-11-19 09:54:49 · 9953 阅读 · 16 评论 -
console.log() 花样玩法
普通版:console.log('日志');const log = '2020年';console.log('日志:',log);# 语法:console.log('','','','',...)升级版:console.log([ '%c ----------------------------', '| 第一次登录 |', ' ----------------------------'].join('\n'));注:我们常见原创 2020-11-12 09:47:37 · 829 阅读 · 0 评论 -
数组遍历(for,forin,forof,forEach,map,filter,some,every,reduce)
文章目录数组遍历方法总结for 循环for...in 循环for...of 循环forEach 循环map 循环filter 循环some 循环every 循环reduce 循环数组遍历方法总结这里记录一下,目前常用的针对数组的一些循环操作,以便以后随时翻阅。所有循环讲解主要部分均由代码展示,更简明明了。for 循环for 循环没啥说的,不过要记得:针对for循环,循环条件总比循环体要多执行一次。不过这个无伤大雅,一般我们都会忽略,下面看代码:const arr = [1, 2, 3, 4,原创 2020-11-11 11:47:58 · 24547 阅读 · 2 评论 -
数组排序(选择,快排,冒泡,插入,桶排序)
文章目录数组排序选择排序快速排序冒泡排序插入排序桶排序sort 排序数组排序下面的所有排序,如果有对解释不好理解的,可以直接选择代入数组,自己梳理一下逻辑就会明白了。也可以去Typescript的Playground 然后把代码拷贝进去自己跑一下。这里说一个知识点:if (array[j] > array[j + 1]) { temp = array[j]; array[j] = array[j + 1]; array[j + 1] = temp;}大家都见过原创 2020-11-10 11:39:24 · 509 阅读 · 0 评论 -
数组去重(reduce && set)
数组去重前言:数组去重的方法有很多,这里记录一下我常用的两种数组去重的方法。温馨提示1:不要把数组的过滤和去重搞混,不是一个东西。温馨提示2:我会用到一些ES6的语法。字符数组去重例如有一数组的结构是这样的:const arrStr = ['a','b','b','c','c','d'],要对这个数组进行一个去重操作,我是这么干的:利用 数组的 reduce 方法:const res = arrStr.reduce((pre:any, cur:any, index:number,原创 2020-11-09 13:47:21 · 544 阅读 · 0 评论 -
angular拦截请求和响应
angular拦截请求和响应拦截器的概念想必大家都不陌生,不过这里还是要提一句(凑一点字数):拦截器就是在我们的请求 发送之前 或 请求返回之后被我们处理之前,先截住。当然截住之后我们可以对其做一些操作,比如:添加请求头,或者根据响应的状态做出不同的提示 等等。拦截器为我们节省了很多不必要的操作,代码更加简洁化,更加有逻辑性。接下来我会举例子,说一下angular的拦截器:通过拦截器给请求自动添加请求头【先看代码】:filename:auth.tsimport { Injectabl原创 2020-11-04 13:09:31 · 1748 阅读 · 0 评论 -
Ionic 标题走马灯效果 and 解决走马灯效果在手机上显示省略号问题
Ionic 标题走马灯效果 and 解决走马灯效果在手机上显示省略号问题废话不多说,直接展示代码:语言:Angular + ionic + typescript + scss所以,vue和react的借鉴一下,自己改造一下。head.component.html<div class="headContainer"> <ion-header [translucent]="true"> <ion-toolbar class="title">原创 2020-11-02 16:29:23 · 354 阅读 · 1 评论 -
Error: Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten...
错误出现原因:今天突然被告知自己写的Angular项目在微软的Edge里显示不了了,而且360浏览器也不行了。后来发现是浏览器版本问题,我的是最新版显示没有问题,而别人用的浏览器版本较旧【这里的较旧指的相对于我的最新版本的来说的】。让用户更新是一个可行的方案,还有就是我们开发者看看怎么搞一下了。首先打开旧Edge版本控制台上,控制台上报了一个错误:Error: Zone.js has detected that ZoneAwarePromise (window|global).Promis原创 2020-10-22 14:19:51 · 1668 阅读 · 2 评论