qq_45560350的博客

原创 nvm安装踩雷 报错‘node‘ 不是内部或外部命令

2.在安装nvm前，确保电脑上不存在之前安装过的node的相关信息，包括环境变量、之前安装的nodejs、node_global文件夹（存储全局安装的 Node.js 模块和依赖）、node_cache文件夹（存储已下载的Node.js 包的缓存）等，一定要删干净再安装nvm。通常 Node.js 的可执行文件 (如 node、 npm、 npx 等) 会被添加到 PATH 环境变量中。默认情况下，npm 会将全局依赖安装到 Node.js 的安装目录下。这些变量通常指向 Node.js 的安装目录。

原创 visibilitychange监听页面可见性改变事件

项目是企业微信内打开的webview页面，用户进入指定页面时，会调用企微提供的，持续监听用户位置变化的API，当用户将企微切后台一定时间后重新回到该页面，API监听不生效（方法并未销毁，只是不生效），查询官方文档，该企微API不支持后台监听，切后台就会被打断，故代码逻辑需改为，判断用户离开页面时，主动销毁该监听，判断用户进入页面时，重新创建监听，而判断用户是否离开或回到页面，可使用visibilitychange事件来判断页面的可见性。- visible 当前页面是非最小化窗口的屏幕最上层的页面。

原创 记录一个奇怪的文件上传问题

项目是在企业微信内打开的webview，bug出现在一个更新数据的接口，参数为FormData对象，包含图片文件。真难搞，只能改变图片文件上传的方式了…将图片先上传，拿到图片的链接作为FormData对象的json属性传过去。判断可能是企微环境的问题，但是又无法解释第一次之后的请求能成功，且图片少于两张也能成功的原因。ios：没问题，一切正常。

原创 nodejs 如何在npm发布自己的包 ＜记录＞

发布72小时内的包可以删除，被删除的包24小时内不允许再次上传。使用markdown语法。

转载 vue 虚拟列表 实现高性能渲染大量数据

前端在实现列表大量数据展示时，需要考虑到性能问题，一次性加载全部的数据，必然出现渲染时间过长导致页面卡顿的现象，过去我常用懒加载的方式实现数据的按需展示，现看到有博主介绍使用虚拟列表去实现，在这里记录一下虚拟列表是一种只对可见区域中数据进行渲染，对不可见区域中数据不渲染或部分渲染的技术，也是实现数据按需展示的一种方式，能大大提高渲染的性能。

原创 ES6 字符串的repeat()方法

n是0到-1之间的小数，则等同于 0，因为会先进行取整运算，0 到-1 之间的小数取整后等于-0，repeat视同为 0。repeat() 方法返回一个新字符串，表示将原字符串重复n次。n是NaN / null / undefined，就等同于 0。n是负整数或Infinity，会报错。参数n：str需要重复多少次。n是字符串，则会先转换成数字。n是小数，会向下取整。

转载 ES6 字符串的 startsWith() 和 endsWith() 方法

该方法用于检索字符串是否以指定的子字符串开头，是则返回true，否则返回false。该方法用于检索字符串是否以指定的子字符串结尾，是则返回true，否则返回false。格式：string.startsWith( str, idx )格式：string.endsWith( str, idx )

转载 ES6 解构赋值

解构赋值的三个条件1.两边结构必须一样2.等式右边必须有意义3.赋值和解构要同时完成console.log(g,h)//报错 等式右边啥玩意都不是let {k,l};//报错 解构声明缺少初始化的对象 可使用括号包裹整个解构赋值语句来解决。

原创 vue中使用faker库生成指定类型的随机数据

Faker.js 是十分流行的 Node.js 工具库，2022年初，Faker.js的作者突然删库跑路，导致众多应用程序崩溃，为了继续使用Faker的功能，社区的几位开发者组成团队决定创建并维护新项目faker-js/faker，现其已成为社区控制的项目，github地址为，官方文档地址。

原创 vue 设置了表单验证的el-input，在触发验证后无法继续输入的问题解决

查阅相关资料后，发现如果页面绑定了addForm的某个属性，必须初始化这个属性名才能正常识别和使用，例如页面上绑定的:prop=“addForm.questionType”，那么初始化时addForm必须是有questionType这个属性的。完整地初始化addForm，声明初始化addForm的方法，在需要初始化addForm的地方调用。在项目中碰到的问题，说是input框出现验证提示后，该框就无法输入新的数据了。

原创 Vue使用IntersectionObserver实现数据的懒加载

MDN上的介绍Intersection Observer API 提供了一种异步检测目标元素与祖先元素或 viewport 相交情况变化的方法，Intersection Observer API 会注册一个回调函数，每当被监视的元素进入或者退出另外一个元素时 (或者 viewport )，或者两个元素的相交部分大小发生变化时，该回调方法会被触发执行注意，初始化监听目标元素时，回调函数就会触发一次。

原创 Vue中使用new Date().getTime()作为组件遍历时的key值会导致组件不断销毁和创建的问题

在项目中遇到的一个问题，在子组件中监听父组件给其传递的一个值，但发现监听回调不生效，经反复调试发现，子组件多次触发了created和destroyed生命周期钩子，也就是说子组件被多次的创建和销毁。当key的值发生变化时，Vue会认为这是一个新的组件，因此会销毁旧的组件实例并创建一个新的组件实例，这就导致了组件不断销毁和创建的循环。要解决这个问题，就需要使用一个稳定的、唯一的值作为:key的值，而不是使用每次渲染时生成的随机时间戳。查啊查原因，说是每次渲染时，

原创 微信小程序 基础模板引入sass的两种方法

【代码】微信小程序 基础模板引入sass的两种方法。

原创 echarts 实现空心饼状图 中间展示选中块内容 带默认展示文本效果

【代码】echarts 实现空心饼状图 中间展示选中块内容 带默认展示文本效果。

原创 认识 AbortController控制器对象 及其应用

AbortController是一个控制器对象（DOM API），可通过new构造函数的方式，生成控制器实例对象，根据需要终止/取消一个或多个Web请求/监听事件通过new生成的控制器实例对象很简单，只有一个方法abort()，和一个对象属性signal（AbortSignal对象）signal属性上还有三个属性，主要用到aborted属性，表示是否已终止，其初始值为false当控制器的实例方法abort()被调用时，实例对象的signal属性会触发abort事件，并将signal上的aborted。

原创 openlayers 地图地理坐标、屏幕像素坐标相互转换（实际应用）

反馈问题，希望点击阀门要素后，地图比例尺不改变，也就是地图不再缩放，这时再写死向下移动的0.001，在不同的比例尺下会出现要素飞出屏幕的情况。而 k点 的地理坐标可以从t点地理坐标推过来，但是地图的比例尺发生改变，两个地理坐标之间的数值关系就不能写死，但屏幕的像素坐标可以。方法用于移动地图中心至传入的地理坐标处，也就是说，只要我拿到A’页面的 k点 处的地理坐标，就能够实现。可以看到 t点 在A面的右下位置，我想让它到移动到页面的中上位置，也就是A‘页面的上中位置。

原创 openlayers6 使用svg格式图片作为Icon标记

产品今天跟我说需要替换在地图上展示的图标，发给我的是svg格式，原本用的是png格式的将svg格式的图片拖进项目，修改对应的图片路径后，发现并没有生效问了同事，说之前也有进行尝试但都没有成功，查了好久的资料，终于搞出来了。

原创 js 创建 指定长度 指定相同参数 的数组

Array构造函数会根据给定的arguments来创建一个数组(如果不是仅有一个参数且为数字的话)， 通过Array.apply传入一个length为10的空数组则相当于， 把一个空数组中的每一个元素的值逐个传入Array()方法， 而空数组中的每一个元素的值都是 undefined。方法可以接受数组或类数组对象作为参数，（类数组对象，即类似数组的对象，本质特征只有一点，即必须有length属性）任何有length属性的对象，都可以通过Array.from方法转为数组。：es6提供了的一个新的api，

原创 js 踩了正则表达式的大坑！lastIndex属性

正则表达式

原创 vant表单检验里去掉输入框的前后空格

vant表单验证

转载 parseInt() 和 Number() 选哪个

parseInt和Number

原创 js indexOf方法使用位运算符简化写法

按位运算符

原创 字符串的 substring() 和 substr() 方法

数组的substring方法和substr方法

原创 jq使用easyui的Datagrid表格 实现点击行点击事件和单元格点击事件

jq使用easyui的Datagrid表格 实现点击行点击事件和单元格点击事件

原创 js获取input框后的文本节点的文本内容

js获取input框后的文本节点的文本内容

原创 jq使用easyui的Datagrid表格 实现根据行变量的某属性给行添加样式

jq使用easyui的Datagrid表格 实现根据行变量的某属性给行添加样式

原创 jq使用easyui的Progressbar进度条

jq使用easyui的Progressbar进度条

原创 vue组件内实现监听某变量改变事件只生效一次

vue组件内实现某监听事件只生效一次

原创 vue项目中$once(“hook:beforeDestroy“,() =＞ {})的使用场景

vue使用$once("hook:beforeDestroy",() =＞ {})

原创 js中?.、??、??=的用法和含义

js中?.、??、??=的用法和含义

原创 vue的内置组件component 好东西

vue内置组件component

原创 小程序 scroll-view组件使用scroll-x + flex布局 子元素无法横向显示问题

小程序 scroll-view

原创 iframe内层文档里的em单位与什么有关

iframe内层文档里的rem单位

原创 e.target和e.currentTarget的区别

e.target和e.currentTarget

原创 js常见的的6种继承方式

js中常见的6种继承方式

转载 Object.defineProperty()和Object.defineProperties()

js内置对象Object的方法

原创 react中实现v-html功能

使用dangerouslySetInnerHTMLexport default class NovelItem extends Component { render() { const novelMsg = this.props.novelMsg; return ( <div className="novelItem"> <div>{novelMsg.title}</div> // 注意:__html有两个

原创 react引入sass公共样式不生效

参考文章1.npm install node-sass --save-dev2.npm install sass-resources-loader --save-dev3.找到webpack.config.js路径在：node_modules\react-scripts\config\webpack.config.js4.初始代码{ test: sassRegex, exclude: sassModuleRegex, use: getStyleLoaders( {

转载 前端节流、防抖

前缘节流按我/*** 节流*/},time)})前缘防抖} ">确认//binding.value()即调用传进来的方法!}, time);});},});

原创 vue监听localStorage和sessionStorage数据变化