自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(46)
  • 收藏
  • 关注

原创 微信小程序使用lime-echart踩坑记录

但是,如果你的js包要是放到static目录外面,你的项目在编译的时候就不会把这个js文件打包到小程序中,一旦切换到使用图表的页面中就会立即报错,找不到js文件;的文件替换了esm格式的文件,保存重启后发现直接在编译阶段就报错了,然后我就到component中搜索了一下static目录下是否有引用文件,排除一下是否是因为我替换了js文件导致的,结果发现了在。直接从百度上搜索echarts官网,切到文档中,选择入门篇-》获取echarts,直接翻页到最底部就能获取到定制功能。,版本一开始安装的是。

2023-09-06 10:47:24 1984

原创 uniapp利用scroll-view实现滚动触底加载

微信小程序官方在scroll-view中也提供了一种触底加载的方式,也没有我写的这么复杂,在uniapp中要改写成vue的方式。可以使用以下这种方式来做滚动触底加载,但是官网提示长列表性能不太好,目前也没有更好的方式,暂时先这么处理。才能生效,两个方式各有优劣,选择适合自己的就行了。

2023-07-05 16:32:19 3191 1

原创 执行发包命令npm publish的时候报错处理

当npm publish命令的时候,如果在package.json中,有在script中定义prepublish或者prepare脚本的话,就会被立即执行,这些是用来必要的构建步骤,比如编译代码、打包等等。所以我注意到package.json中带有脚本,先直接移除再执行命令就可以正常运行了,这些前置脚本并不是每一次都会执行,所以移除后也不用担心会哪里出问题。当执行发包命令npm publish上传包的时候,总是报错。会自动执行的前置字段。

2023-06-29 10:59:02 1721

原创 解决HBuilderx编辑器在小程序模拟器的时候报错“本项目类型无法运行到小程序模拟器”

到项目上一看发现是自己将App.vue文件搬到了别的位置导致了项目的类型改变了,将App.vue拉回根目录后,重新识别项目类型就恢复了。项目开发的时候,在HBuilderx将项目不小心移除后,再次打开后突然发现运行小程序模拟器的时候,无法运行到小程序了。于是就顺势点开了弹出的详情,发现项目类型改变了,重新识别项目还是web类型的,

2023-06-28 18:02:49 1923

原创 实用react防抖

代码】实用react防抖。

2022-08-11 19:34:45 288 1

原创 Echarts中无法还原区域缩放问题处理

<ReactEcharts ref={echartsInstance} onEvents={onEvents} option={myOptions}/>// 获取到echarts实例const echartsInstance = React.useRef();// 引入数据区域缩放组件后const myOptions = { ... };// 事件处理const onEvents = { // 点击重置触发 restore: () => {

2022-02-14 18:05:40 1481

原创 HTML+CSS手写科技感六边形

最近有个需求需要实现一堆这种五颜六色的六边形作为气泡容器,于是就参考网上的思路写了一个这样的六边形。效果图如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wid

2021-12-16 16:54:21 1095

原创 在ts中item[key]类型报错应该怎么给对类型

在使用ts的过程中,遇到一个类型报错的问题,特地过来记录一下,既然使用了ts就尽量不使用any这个类型,遇到问题解决问题才能成长。// keyof关键字可以获取到某一种类型的所有键值,并返回联合类型for(let key in newData[0]){ type keys = keyof investCategoryResponseType; newData.map((item: investCategoryResponseType) => item[key as keys]);}..

2021-12-16 16:05:59 3281 2

原创 加了key为何还报Each child in a list should have a unique “key“ prop

devScripts.js:5836 Warning: Each child in a list should have a unique "key" prop.Check the top-level render call using <div>. See https://fb.me/react-warning-keys for more informationin Fragmentin Unknown (created by Context.Consumer)in Route (c

2021-12-16 16:01:56 1727

原创 Echarts图表渐变的使用

我有尝试着使用官方提供的案例来使用渐变,但事实上是在我这个场景中并不适用,并且网上很多都是跟官方的这个例子相差无几,所以我从配置手册中换了另一种方式。// 目前官方示例中这个方式在我这里是无法使用的!所以就换了下面的方式来实现渐变!itemStyle: { normal: { color: new echarts.graphic.LinearGradient( 0, 0, 0, 1, [ {offse

2021-12-16 15:55:22 514

原创 [antd: Checkbox] `value` is not a valid prop, do you mean `checked`?

结构:<Checkbox value={'1'}>保存</Checkbox>devScripts.js:5836 Warning: [antd: Checkbox] `value` is not a valid prop, do you mean `checked`? at InternalCheckbox (http://localhost:8000) at div at div at form ........爆出这个问题的时候

2021-11-24 17:31:09 3862

原创 p标签包裹div标签结构导致的报错:<div> cannot appear as a descendant of <p>

接手了上任的工作后,发现不少的问题,在control中爆出了这样一大片的错误,找到对应位置后,仔细一看发现是p标签内包了很多的div标签,这还得了,直接随手就改了。devScripts.js:5836 Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>. in div (at PieCharts.tsx:277) in p (at PieCharts.tsx:269

2021-09-23 16:26:49 2921

原创 如何在浏览器中获取到接口的Response Headers的数据

记录一下今天在不同的框架中怎么获取到浏览器接口中的Reasponse Headers中的数据。一、React项目中export() { return request(`/api/vitroFree/onePartNotRegist/${companyId}/export`, { method: 'GET', headers: { 'Content-Type': 'application/json' }, responseType: 'blob' |

2021-09-23 16:21:07 2214

原创 React上传组件限制上传文件问题

当有测试小姐姐陆续跟我提xxx后缀的文件无法正常上传的时候,我们可能就陷入了,怎么可能********…。1. 直面问题我们一开始固定的想法就是使用type来进行文件类型的判断,这是毫无疑问的,不判断类型判断个啥对吧!我后来发现这个type可能会受到多种因素的影响,导致type值在不同的地方有不同的表现,举个例子吧,就比如上传一个.zip后缀的文件,在我win10系统中的type值是application/x-zip-compressed,而在mac系统中的type值是application/zip,通

2021-09-17 10:26:05 731

原创 一招搞定angular项目中菜单栏匹配路由高亮

一招搞定angular项目中菜单栏匹配路由高亮技术栈:Angular + NG-ZORRO当你的项目中选择一个左侧菜单,一刷新就将高亮选中效果刷没了,或者是通过点击某个按钮跳转到别的路由菜单中,结果发现菜单中高亮效果还是保持在之前的样式,要花费不少的时间来同步,这咋搞?通过路由来匹配菜单一招搞定// this.router.url 获取到当前路由<ng-container *ngFor="let menu of menus"> <li nz-menu-item [nzSe

2021-08-23 16:17:47 687

原创 checkbox多选框样式改成radio单选框

公司项目有遇到一个需求,需要展示单选框的样式和以往的达成统一的一致,但是要支持多选的功能,于是就有了这样的一出多改单的情况,主要是将checkbox的样式改成radio,既有多选的功能又有单选的样式。问题:不论是单选还是多选,样式都是无法改变的,我们应该如何实现将checkbox的样式改成radio呢?思路:我们可以改变其他的样式,比如用一个容器来代替这个checkbox模拟一个radio的样式!checkbox和radio的选中状态都可以通过checked伪类获取到对应的状态,这样实现这个需求就变得简

2021-05-26 16:31:57 1822

原创 在react项目中配置上less预编译处理语言可行方案

less和sass的用法基本上都差不多,我个人还是比较习惯使用less,所以就在项目中配置了一个less。如果你是使用create react-app的话,会默认配置一个sass这个玩意,只需要安装一下就可以使用了。使用yarn eject或者npm run eject都可以将webpack.config.js文件暴露出来,执行完此命令在根目录下会多出config和scripts文件夹,在config文件夹下可以找到webpack.config.js配置文件。执行以上操作后,找到以下配置信息// s

2021-04-22 11:38:21 200

原创 react中配置less命令后,报出错误TypeError: this.getOptions is not a function解决方案

./src/page/test/redux-page.less (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-6-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--5-oneOf-6-3!./node_modules/less-loader/dist/cjs.js??ref--5-oneOf-6-4!./src/page/test

2021-04-22 11:30:48 1182 1

原创 module.exports、export default以及export的区别以及用法

module.exports、export default以及export的区别以及用法moule.exports是JavaScript 2015之前的语法,而后两种则是JavaScript 2015之后的语法,提供了export default默认导出和export名字导出两种文件导入导出的方式,在一次面试的时候问到require引入是es5还是es6的时候问懵了,所以就详细的查了一些网上的历史资料。moule.exportslet path = "/local/file"let obj =

2021-04-22 11:12:40 1168

原创 react中点击报Cannot update during an existing state transition跳转出错

在写react项目的时候遇到一个这样的报错,根据提示信息我试着将写在render方法中的路由跳转写到了事件函数中,就解决了该问题。index.js:1 Warning: Cannot update during an existing state transition (such as within `render`). Render methods should be a pure function of props and state.<Button onClick={ this.props

2021-04-20 16:45:21 357

原创 在react项目中调用百度地图API的BMap后报错解决方案

我这里是使用了react+typescript技术栈,在./public/index.html文件中引入百度地图项目的文件,就相当于是全局导入了,但是并不能直接使用相关的API。<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=应用的key"></script>需要在使用的文件中这样声明一下,然后就可以直接使用了。const wins:any = window;cons

2021-04-20 16:41:46 1188

原创 React中的Render Props模式

Render Props是一种react组件之间使用prop数据共享的简单技术,是一种开发时可以使用到的一种技巧,可以实现组件的高可复用性。假设我们有一个需求,需要获取到鼠标在页面中的一个位置,我们可能会这么写:interface StateInterface{ x:number, y:number}class Mouse extends React.Component<any,StateInterface>{ constructor(props:any){

2021-04-20 16:37:17 180

原创 react项目中报“Cannot update during an existing state transition“问题解决

在react项目中遇到一个这样的报错,根据提示信息我试着将写在render方法中的路由跳转写到了事件函数中,就解决了该问题。大致的意思在跳转的时候不能在render方法中更新props或state,只要避免这么干就不会出现问题,index.js:1 Warning: Cannot update during an existing state transition (such as within `render`). Render methods should be a pure function of

2021-04-15 10:34:59 1760

原创 React之context数据传值

在react中,组件的传值方式一般都是通过props属性来进行传递数据的,对于简单的组件来说是适用的,但是对于一些极其复杂的组件来说是非常致命且难以维护的,Context就提供了这样的一种解决方案,不用通过组件一层一层的向下传递到指定的组件中。一、简单示例在以下的示例代码中,将会简单的展示如何使用一个context,例子中用了PageComp、Comp01、Comp023个嵌套组件来实现这样一个需求,从最高层级的PageComp组件中将数据传递给Comp02中并展示出来,按照以往传统的做法是通过prop

2021-04-13 17:18:14 724

原创 前端代码片段配置详情

从VS Code官网详细的学习了一下代码片段的配置,使用起来也是非常的方便,可以将一些固定的代码片段配置起来,通过几个快捷的字符输出到编辑器中,高效的编码。一、插件内置的代码片段目前有很多的插件都配置有代码片段,下载安装了这款插件就可以直接使用这些代码片段,大大的提高了开发的效率,下面简单的介绍一下插件下载安装后,就能直接的使用vue组件中定义的Code Snippets代码片段,还有很多其他的插件也是直接这么干的,大家可以自行去看。二、 自定义配置的代码片段我们也可以自定义自己的代码片段,并且

2021-04-06 22:59:29 243

原创 在Hbuilderx中运行微信小程序无法打开开发者工具

根据给的提示信息,我找到了微信开发者工具,开启对应的配置信息就可以了。关闭之后,重新再Hbuilderx中运行到微信开发者工具就打开了。

2021-03-17 14:12:43 1663

原创 nodejs的网络爬取

我们有的时候需要一些数据,但是自己去造又比较的麻烦,于是就有了一种解决方案,使用工具去抓取到自己想要的内容。这是一款基于nodejs的抓包工具(Crawler),使用方式还算比较简单,直接看代码吧。官网任意门:https://www.npmjs.com/package/crawler安装:npm i crawlervar Crawler = require("crawler"); var c = new Crawler({ maxConnections : 10, // Thi

2021-03-15 14:44:02 331

原创 如何快速将电脑密码清空

打开设置 -> 登录选项 ->密码输入当前电脑的密码下一步之后,新密码全部为空,就相当于没有密码下一步完成。直接win + l快捷键将电脑锁住试一下,直接无密码登录进去了。

2021-03-13 14:38:14 207

原创 Nodejs对数据库的增删改查

这里详细聊一下nodejs如果对数据库进行增删改查,OK!为了方便一点,我这里使用的是phpstudypro这个工具的内置数据库来操作,就没有专门安装MySQL数据库这个玩意了。一、前置准备首先将phpstudypro这个工具安装完成后打开,启动MySQL数据库启动MySQL数据库后,再打开数据库工具 -> SQL_Front,第一次打开数据库工具一般是没有下载的,按照提示下载这个工具即可。下载完成后,再重新打开这个SQL_Front,就会出现一个登录信息页面,可以自己配置数据库的信息,

2021-03-13 00:11:49 1114

原创 用JavaScript解析出URL中的查询值

用JavaScript解析出URL中的查询值,例如:输入字符串https://www.baidu.com/?name=zs&age=18,输出对象{ name:'zs', age:18 }// 1.获取到url中的参数let paramArr = window.location.href.split('?')[1]// 2.用字符串方法将参数切割成数组let itemArr = paramArr.split('&')// 3.声明一个空对象let obj = {}itemAr

2021-03-12 22:39:24 361

原创 Vuex的使用

记录总结下Vuex的学习以及复习的过程吧,更加的巩固了其使用的方式和深入理解。一、安装vueximport Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)const store = new Vuex.Store({ state:{ index:0 }})// 将store对象暴露出去,并且挂载到vue实例中export default store;二、使用store可以直接通过store对象将stor

2021-03-12 22:14:52 172

原创 Nodejs报Cannot enqueue Query after invoking quit错误的解决

PS C:\Users\Administrator\Desktop\note_text> node .\app.js服务器开启error,result,fields Error: Cannot enqueue Query after invoking quit. at Protocol._validateEnqueue (C:\Users\Administrator\Desktop\note_text\node_modules\mysql\lib\protocol\Protocol.js:

2021-03-11 18:03:40 3317

原创 Nodejs连接数据库报“Cannot set headers after they are sent to the client“

我这里是使用mysql + nodejs,请求接口后就直接爆出这个问题,然后就仔细检查了一下代码,发现以下问题,就对应的解决方案,目前已经解决。在上面循环中会有两次使用send方法,就会报这个问题,直接return掉就行了。app.post('/test_post',(request,response)=>{ let { username, password } = request.body connection.query('select * from user',(error,

2021-03-11 16:57:19 749

原创 node从零开始搭建一个服务器

很久以前就学习过nodejs这玩意,所以有些朋友问我怎么使用nodejs搭建一个服务,所以今天又重新拾起记忆,准备写一个简单的服务器并记录下来。这里使用了express框架来搭建,首先就需要安装好express。安装:npm install express安装完成之后,需要创建一个js文件,我这里命名为app.js方便记忆。express中文官网的地址:https://www.expressjs.com.cn/starter/basic-routing.html一、初步搭建const expre

2021-03-11 00:02:56 478

原创 关于浏览器更新后出现的样式问题

Chrome浏览器更到最新版本后,有一些样式就无法生效了。在网上找了很多的方式也没有办法恢复样式,于是就自己尝试着改变了一下选择器的层级,将样式单独移除作用到组件结构上,发现样式是可以生效的,最后发现加了deep的选择器样式无法生效,然后将其移除后样式就立马生效了,做了多次尝试后发现了一些问题,以下总结一下。在style中没有加上scoped在style中不加上scoped(scoped的作用就不解释了),在浏览器更新后就出现了问题,无法使用deep修饰样式选择器,但凡是使用了的都不会生效。解决办

2021-03-10 09:26:19 908

原创 git分支操作

Git分支的操作git分支的操作在我们日常的开发生活中是比较常见的,首先我来归纳总结一下比较常用的分支操作命令。git branch 分支名字创建新分支。git branch查看当前分支,git branch -r查看远程仓库中的所有分支,git branch -a查看所有分支(包含远程仓库中的分支)。git checkout 分支名切换到指定的分支,git checkout -b 分支名创建一个分支并且切换到该分支。git merge 分支名将分支名合并到当前分支中。git branch -

2021-03-07 23:39:38 129

原创 Git命令行常用操作命令

常用的Git Bash命令除去平常工作生活中使用到的git操作命令外,本人还尝试了一些别的操作,感觉这个小黑框就是跟linux系统中的差不多,所以就尝试了一些比较基本的,看看这些操作能不能提高日常工作效率咯。pwd··(print working directory)查看当前的目录。cd(change directory)切换目录,比如返回上一级目录cd ..。ls(list)查看当前目录下的内容,ls -a(查看当前目录下的所有文件,包含隐藏文件);ls -l(查看当前目录下的可见文件,以列表的

2021-03-07 00:36:30 218

原创 如何处理margin中的合并和叠加现象

什么是margin合并?在实际的网页开发中,我们经常会遇到一些不符合预期的情况,就比如两个div之间设置的margin会进行合并和叠加的现象,我们应该如何处理和防止这样的情况发生。兄弟关系中的margin合并和叠加两个上下div的margin中会进行一个合并,只显示最大的margin值,如下图另外需要提一嘴的是,两个兄弟关系中的左右div元素设置margin,还会发生左右的margin叠加现象父子关系中的margin合并在嵌套关系中的两个块级元素中,只要给子元素中设置一个margin-top

2021-03-05 11:46:27 740 1

原创 注册微信小程序

在网上搜索微信公众平台,找到官网位置点进去。由于我们需要注册的是小程序,直接选择账号分类下的小程序即可,进入新的页面后直接拉到最底下。点击注册后就会到一个表单填写的页面,完善表单信息即可,要注意的是一个邮箱只能注册一个小程序将账号信息完善之后就可以点击下一步,进入到邮箱激活了通过邮箱中的链接,进行小程序注册的第三个步骤,如果是个人就直接填写个人即可当所有的信息都审核完成,就可以回到微信公众平台,用微信直接登录进去,第一需要关注的就是设置下基本设置中的AppId,在使用微信开发者工具的.

2021-03-04 00:28:21 288 2

原创 Git的快速入门

一、Git的安装Git下载完成之后,安装方式跟一般的软件一样安装即可,没有什么特别的。如果去验证是否安装成功?直接到桌面单击右键列表中有显示Git Bash Here就安装成功了,如图:Git官网地址二、Git工作原理为了更好的学习Git,我们必须要了解Git管理我们文件的三种状态:已提交(committed)、已修改(modified)和已暂存(staged),以及Git项目中的三个工作区域:Git仓库、工作目录和暂存区域。Git仓库:Git用来保存项目数据的地方。当其他计算机克隆仓库时,拷

2021-03-03 23:22:27 207 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除