- 博客(35)
- 收藏
- 关注
RSS订阅
原创 vue3+Vite+TS项目，配置ESlint和Prettier
是一个用于检测 ECMAScript/JavaScript 代码中的潜在问题和错误的工具，旨在使代码更一致并避免错误。它可以帮助开发者检测代码中的潜在问题，提高代码质量。一个“有态度”的代码格式化工具支持大量编程语言已集成到大多数编辑器中几乎不需要设置参数为什么使用Prettier?按保存键时，代码就被格式化了代码评审时无须争论代码样式节省时间和精力ESLint配置文件（需求不同，会有一些差异）env: {},extends: [],env: {},},},
2024-03-25 11:18:05
12464
6
原创 uni-app授权登录，获取用户信息及用户手机号
最近刚接触了uni-app，用于开发微信小程序，设计到了微信授权登录。抽个时间整理个笔记，适用于向我一样刚开始上手uni-app的初学者。
2021-12-15 11:06:21
11144
2
原创 使用markdown-it插件，控制链接的点击事件
长链接：https://www.test.com/file/fj45j3k2efsf9d9g8mcnbn8774nbf77ndsfbsghjhjvd77g834bbkk。使用场景：AI项目回答的格式是markdown，于是引入了markdown-it用于展示，因为存在引用链接过长的问题，用户体验不好，决定将长链接改为短链接进行跳转。短链接：https://www.test.com/file/884747636。
2025-03-26 11:14:13
215
原创 公众号微信网页开发------使用JS-SDK
路由切换时操作的是浏览器的历史记录，iOS会把第一次刚进入时的URL作为真实URL，安卓会把当前URL作为真实URL，导致后端在配置好的授权参数获得的config参数和微信sdk获取的参数是不一样的，所以ios的url参数对不上会一直报错realAuthUrl invalid signature 当然别忘记ios是哈希路由模式 也需要将#后面部分进行截取否则也会导致无法对应。url的值是当前页面的路由，用location.href.split(‘#’)[0]，这里就是文章开头的坑2了！
2025-03-25 16:32:14
1011
原创 npm login 或者 npm publish 超时timeout
因为想发布到npm上，所以这里的镜像源要换回https://registry.npmjs.org，分析这个问题，timeout，那大概率被公安部墙了，我都服了，npm你墙它干啥！多年前也自己试过发包，很顺利，没有问题。后面尝试了很多方法，发现这个对我有效，就是设置代理。但现在不行了，一开始就卡死了，就报这个错误。1.更新npm和node的版本，用最新的。3.公司网络导致的？代理的地址怎么来的没研究，但确实可行。2.科学上网导致的？为了解决这个问题，我尝试了。
2024-09-05 11:01:47
1005
2
原创 微信开发者工具编译后，页面空白，Wxml内容为空
最近遇到了一个奇怪的问题，使用的uniapp运行的微信小程序，改动代码保存后页面就变成空，接口调用一切正常，Wxml内容为空。截止2024年4月3日，最新版微信开发者工具有bug，版本号1.06.2402040。回滚版本后，问题解决。相信后续官方应该能修复这个bug，但是现在的我等不及了。清除数据缓存后才正常，但是对于日常开发而言体验极差。好人做到底，下面的是windows X64的下载链接。根据错误提示，尝试了以下方法也没有用。历史版本的下载，可以参考这个网站。最终，我的问题解决了。
2024-04-03 16:20:31
2616
6
原创 给页面或者特殊组件添加水印
主要分以下两种情况:1.常规页面2.特殊组件1.常规页面直接按照这个操作,即可获得你想要的水印https://www.zhangxinxu.com/wordpress/2020/10/text-as-css-background-image/使用的方式就是通过css将水印设置为背景图,难度不大.2.特殊组件特殊组件指的是有时候想给引入的iframe或者其他的第三方组件(如:onlyOffice)添加水印.因为这些往往都是经过封装,单纯的改组件不可取,就要换一种思路.实现的方式不变,就是给把水印设
2021-05-06 12:06:23
1469
3
原创 前端常用方法整理与区分（字符串，数组，对象）
前端常用的api很多，有些api功能上很接近，但是在具体的使用上面还是有差异的。就好比：1、有些是在原数组上修改，有些是创建一个新的数组，原数组不变。2、哪些api是专门用来操作字符串的，哪些api是用来操作数组的。3、方法直接调用呢，还是方法中要放参数。特别像我这种鱼的记忆，几天不用就忘干净了。特此整理一下，持续更新中！split()作用:字符串分割成数组一个参数（必填），以这个参数为分割标准返回:数组栗子:var str='12345';var arr=s
2021-01-15 10:13:50
2191
原创 js判断对象是否为空
看似很简单的问题，但在一次做项目的时候被卡住了。。。这可能就是所说的基础薄弱吧不得已单独拿出来整理，快捷好用的方法主要有两个1：使用转化为json字符串，再判断该字符串是否为"{}"var data = {};var b = (JSON.stringify(data) == "{}");alert(b); //true 为空， false 不为空2.es6中可以使用Object.keys(obj)，返回值是一个表示给定对象的所有可枚举属性的字符串数组let person =
2021-01-06 00:52:03
193
原创 git 细节区分
以项目为例,从拉取代码到平时的开发使用git的三个区域:HEAD 指向最近一次commit里的所有snapshot Index 缓存区域，只有Index区域里的东西才可以被commit Working Directory 用户操作区域(工作区)变化过程如下:常规的操作命令git clone 项目路径 //拉取代码git add . //...
2020-10-23 10:49:11
263
转载 React学习笔记-----ref
ref在react初期的时候是用于方便操纵dom元素的,就类似于document.getElementById()这种形式,获取dom树中的某个dom节点.到现在为止,主要有三种使用形式方式1: string类型绑定类似于vue中的ref绑定方式，可以通过this.refs.绑定的ref的名字获取到节点dom注意的是 这种方式已经不被最新版的react推荐使用，有可能会在未来版本中遗弃方式2: react.CreateRef()通过在class中使用React.create.
2020-10-07 20:44:31
425
原创 React学习笔记-----生命周期
react的生命周期的执行流程主要分为以下4种1.初次加载:constconstructor->componentWillMount->render->componentDidMountructor->componentWillMount->render->componentDidMount
2020-10-07 20:07:23
191
原创 前端this指向性问题
时间久了,对前端this的指向中某些细节有些遗忘,单独拿出来整理一下,主要有以下几个部分1.默认绑定,隐式绑定,显式绑定2.构造函数3.map()等api中回调函数的this首先先来说说各种绑定方式之前的区别默认绑定:默认绑定也就是普通函数中this的绑定方式,this的指向是windowfunction test(){ console.log(this);}test() //window隐式绑定:最典型的就是对象中的某个属性是方法,这种this.
2020-09-21 14:54:04
540
原创 url获取?后面所有拼接的参数
在页面传值的时候,经常使用到方法就是url后面通过?拼接参数,再结合&可以实现多个参数的传递,例如http://www.test.com?a=123&b=xyz&b=456传参不难,只需要按照格式拼接起来,难点在于如何获取拼接好的参数,以上面为例,也就是获取?a=123&b=xyz&c=456这部分内容使用window.location.search！对，原生的这个api可以获取到?以及后面的参数值，但是不友好的地方在于获取的是字符串，给我们这么一坨东西
2020-09-02 13:40:31
6472
原创 多个div在一个容器下横向布局,且实现滚动效果(不使用flex布局)
之前项目上有个需求就是：多个div在一个容器下横向布局，且实现滚动效果。(兼容ie浏览器,所以不能使用flex布局)首先想到的是overflow-x：auto或者scroll。但是这里的需求它无法满足，因为这个属性适用于类似文本的内容，就好比<div>测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据</div>如果这里的文字超出了div的宽度，设置这个属性是没有问题的，但是目前的需求是想让如下的项目们都能排成一排<div id
2020-08-28 17:51:57
1158
转载 ES6 class类的用法
es6 class基础用法以前的JavaScript没有类的概念，它是基于原型的面相对象的语言。原型对象的特点就是将自身属性共享给新对象。我们先看一下下面的代码实现。//常规写法function Person(name, age) { this.name = name; this.age = age;}Person.prototype.sayInfo = function() { console.log(`${this.name}是${this.age}岁`);};const
2020-08-02 09:13:12
654
原创 leaf-ui打版
1.leaf-ui提交代码(使用idea),提交前改下package.json中的版本号2.运行npm run pub(推荐在git bash中运行,在终端可能有问题),执行过程中不要输入其他的命令,如出现提示输入yarn upgrade命令,也不要管.终端问题如下:(多出一空白行)出现如下结果证明leaf-ui打版成功3.前端打版:找到hls-front的package.json文件,修改leaf-ui的版本,从头执行一遍readme.md中的启动项目部分4.发布npm,执
2020-07-12 15:56:39
464
原创 echarts常用样式
最近和echarts打交道比较多，不得不说这个工具真的强大。特别是针对图表类的前端展示，各种样式都是可以实现的，但是对于刚上手的程序猿们，去改一些默认样式还是很费时间的，就像是在学一门新的语言，需要不停地问度娘，逛贴吧博客。近期就把在项目上使用的一些比较常用的样式列一列~1.坐标轴刻度线隐藏xAxis:{ axisTick: { show: false, // 坐标轴刻度线隐藏 },}2.坐标轴字体颜色xAxis:{ axisLabel: { c
2020-06-24 10:58:59
1179
原创 js原生tab标签页（不使用jquery）
项目需求是使用原生js写出如下样式：先说下实现的思路，1、关于tab按钮切换，先默认给三个tab按钮一个共有的样式，然后再单独拿一个class写一个当前选中tab的样式。切换的时候，当前的tab按钮添加这个class，同时去掉另外两个tab按钮的class（不管有没有）2、关于tab内容的切换，一一对应，设置当前tab页的内容为display:block，其他的两个的内容设置为display：none代码如下html：<div class="sellcount_tab">
2020-06-24 00:15:03
1133
原创 js 跳出循环后,终止循环体后代码的运行
这个问题简单点描述就是当条件成立时，不光要跳出循环，还要跳出当前执行的方法。提到循环，方式有很多，for循环，foreach()，map()，filter()，find()，every()。这里千万不要使用foreach()，因为foreach没有返回值（return），这就导致你在回调函数中使用return false直接失效。推荐使用every()，代码奉上。const arr=[1,2,3,4,5,6];const num=4;function exit() { con.
2020-06-08 21:03:16
2506
原创 js数字转金额类型
项目上有个需求，要把接口中的金额这个字段(数字)，转换成金额的格式呈现在页面上。金额的格式就例如：100,000,000.00123,456.78整数位从低位往高位每三位用逗号隔开，并且保留两位小数。网上最简单的方式toMoney(num) { num = num.toFixed(2); num = parseFloat(num); num = num.toLocaleString(); return num;}用到了3个js原生方法1.toFixed
2020-06-02 00:20:11
2356
2
原创 css使用百分比画正方形并做图标的水平垂直居中
之前项目有个需求，要求前端画出下图的样式样式布局好说，flex用就是了。正方体的容器（使用百分比），里面套一个图片html：//使用react <div className={style.item_img}> <img src={system} className={style.item_img_icon} /></div>css：//使用less.item_img { width: 10%; height:
2020-05-25 20:15:18
575
原创 面试题：对于原型和继承的理解
前言:js基础中很重要的一部分内容，前端面试必问题目。主要从以下几个方面讲讲原型和继承（讲的很浅薄，只适合初学者瞅瞅，大佬求放过） 构造函数和普通函数 [[protoptype]]和prototype（[[prototype]]也可以叫做__proto__） 原型、原型链、原型对象 继承的六种方式 一、构造函数和普通函数说到原型，一定离不开构造函数...
2020-05-11 16:13:27
3161
1
转载 es6 class类的初探
传统的javascript中只有对象，没有类的概念。它是基于原型的面向对象语言。原型对象特点就是将自身的属性共享给新对象。这样的写法相对于其它传统面向对象语言来讲，很有一种独树一帜的感脚！非常容易让人困惑！如果要生成一个对象实例，需要先定义一个构造函数，然后通过new操作符来完成。构造函数示例：//函数名和实例化构造名相同且大写（非强制，但这么写有助于区分构造函数和普通函数）fun...
2020-05-08 09:48:59
93
转载 数组去重方法
数组去重方法es6的set方法(推荐)双层循环1.es6的set方法let arr=[1, 2, 2, 3, 4, 3, 5]let set6 = new Set(arr)console.log('去重后的数组为:', set6)输出后的结果为[1,2,3,4,5]2.双层循环如果有相同的值则跳过，不相同则push进数组Array.prototype.distinct...
2020-04-14 20:24:11
694
原创 简单区别函数声明与函数表达式
函数声明:function a(){ console.log("hello world");}函数表达式:"var a="后面的就是函数表达式var a=function (){ console.log("hello world");}
2020-04-14 20:18:57
112
转载 深拷贝与浅拷贝
深拷贝与浅拷贝要了解其本质区别，就需要了解堆和栈，值与引用的概念及区别1.堆（heap）和栈（stack）heap为自动分配的内存空间，它由系统自动释放；而stack则是动态分配的内存，大小不定也不会自动释放。2.值与引用js中有基本数据类型和引用类型；基本数据类型的变量和值都是存放在栈中，声明之后会分配一块内存区域，基本数据类型之间的赋值是直接把栈内存中存的值赋值给变量（传值）引用...
2020-04-14 20:04:56
120
原创 函数应用以及变量特性
废话不多说,先上代码function Foo() { getName = function () { console.log(1); }}Foo.getName = function () { console.log(2);}Foo.prototype.getName = function () { console.log(3);}...
2020-04-04 21:14:41
182
原创 vue自学的第一天
两种使用vue的方式：1.直接使用<script>引入这种适合做练习和小项目，结合vue开发，不需要使用到vue家族中的其他成员。代码示例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewpo...
2020-01-13 16:49:07
184
原创 常用的css清除浮动
基础代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .father{ width: 1000px; ...
2019-09-11 16:16:58
104
转载 css新特性整理
css新特性整理List itemList item1.CSS3的选择器1）E:last-child 匹配父元素的最后一个子元素E。2）E:nth-child(n)匹配父元素的第n个子元素E。3）E:nth-last-child(n) CSS3 匹配父元素的倒数第n个子元素E。2.@Font-face 特性Font-face 可以用来加载字体样式，而且它还能够加载服务器端的字...
2019-09-11 15:39:17
176
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人