- 博客(55)
- 收藏
- 关注
原创 debug持续记录
组件内不执行 useContext 吐出的方法。怀疑是执行了初始方法,打印下来确实是。怀疑传参不成功,由此检查层级结构,发现 Context.Provider 根本没包裹目标组件。
2024-02-18 17:43:01 387
原创 vscode 格式化代码后反而出现红色波浪线格式报错
就我自己的情况而言:格式化代码时 vscode 调用的是 prettier 插件配置的规则;而校验代码格式报错红色波浪线 vscode 调用的是 eslint 插件的校验规则。一般认为 eslint 除了代码美化功能之外,还有一些校验功能,所以优先考虑使用 eslint 而干掉 prettier。两者规则不一致,导致 prettier 格式化代码后,eslint 反而认为是不合法的,标注红色波浪线;vscode 代码校验和代码格式化的插件如果一致,那么就不存在规则冲突的问题了。
2024-01-04 20:38:45 1349
原创 如何在 Chrome 上调试文件打断点
2. Ctrl+P 输入文件名称。4. 重新触发代码运行,触发断点。1. 控制台进入 Source。3. 在需要的位置手动打断点。
2023-12-04 20:40:37 592
原创 使用 js 原生 API IntersectionObserver实现内容触底加载
使用IntersectionObserver,在react hook 框架下实现下拉列表的无限滚动加载。
2022-09-21 12:27:25 707
原创 如何将有序列表的排序数字改成左对齐 css
有序列表头部数字标默认是右对齐的。实际需求中,可能会要求我们左对齐。虽然可以通过直接改用然后通过css来模拟ol的效果,但也可以简单地通过css配置解决右对齐的问题
2022-08-01 20:14:30 834
原创 VSCode 格式化 VUE 代码并自定义 Prettier 规则
本文除了说明步骤,也会带上原理和方法,从而更好理解这些工具的机制和相互关系步骤一:在 vscode 上下载安装 Vetur 插件Vetur 是目前 vue 开发几乎必备的 IDE 插件。从官方文档可知,它的常用功能包括了 vue 语法高亮、错误提示、格式化等。基本的开发需求差不多都可以一个插件搞定。下载安装 Vetur 之前,.vue 类型的文件原来会被 vscode 识别为 plainText,下载后,.vue 文件的语法解析挂靠了 Vetur 插件,可以呈现语...
2021-10-10 19:48:54 2023
原创 空格导致的复制命令在终端报 command not found
情况描述:打算在mac终端执行一段命令,之前这个命令都可以顺利执行,这次从自己的飞书笔记上复制下来后再执行,结果报错 command not found(ps:命令的含义是禁止Chrome浏览器左滑回到上次页面,不过这不重要)命令执行失败了,报错 command not found看起来一模一样的命令,之前却成功执行了:那肯定是肉眼不好区分的地方产生了差异。所以将两段看起来一模一样的命令放到纯文本文档中,使用od命令查看文件内容的ASCII 码,看看有什...
2021-09-20 21:47:40 621
原创 如何用js触发jenkins远程任务构建
第一步 配置 jenkins 用户 token1. 在jenkins右上角,点击自己的名字,进入个人页面2. 在个人页面的左侧,点击 “设置”,进入个人设置页面3. 在个人设置页面,找到 API Token模块,新建一个token。这里我已经新建了 123456 的 token,再新建一个 2222 来做例子3. 如上图,先点击 “添加新Token”,会弹出新的空白输入框。输入Token名称,点击生成,就会出现下图的情况。复制该字符串,作为 token。第二步 .
2021-07-07 20:34:45 968 2
原创 antd 表单一个label下多个内容
1. 如何实现一个 label 旁并排多项内容比如这样,在 other 的 label 下,既有输入文本域,又有 toggle 开关。同时两者有序地并排在右侧,同一行。方法是再用一层Form.Item分别包裹右侧内容,并且设置noStyle属性示例代码: <Form.Item label="Date of Birth:"> <Form.Item name="birthDate" noStyle>
2021-05-06 16:02:00 1311
原创 csv-parse 解析csv文件报错 Invalid Record Length: expect 4, got 7 on line 8
在找虫的过程中发现如果把有问题的文件重新保存一次,报错消失。并且对比前后两次的文件大小,有1字节的差异。这1字节应该就是关键。要看下两个文件这1字节差在哪里,需要查看文件的字节码在终端输入vi -b 文件名,使用二进制模式进入后输入:%!xxd文件的字节码(对应ASCII码表)就展开了。窗口的右边的字符是一一对应的左边的文件是有问题的,右边的可以成功解析。差别就在于右边文件,所有的换行符都是 0d 0a ,对应 ASCII 码表是“回车”+“换行”。...
2021-03-09 18:14:27 790
原创 怎么避免 Promise.all 其中一个 reject 让所有都取不到值
大家都知道 Promise.all 传入的 promise array 里面,只要有其中一个 promise reject 了,即使它前面的 promise 正常 fulfilled,整个 promise.all 也会直接走到 catch,并且只会 catch 第一个 reject 的返回值。那如何让一串promise 用 Promise.all 实现并行不阻塞地调用,同时每个的reject 和 fulfilled 状态不互相影响呢?答案是将这串 promise,每个都用一个新 pro...
2021-02-04 12:08:52 1958
原创 iview 如何跨组件控制和同步 Modal 的显示隐藏
开发中经常遇到的情况,假如页面需要弹出一个模态框,这个框里的内容也比较多,那么很自然地会考虑把模态框及其中的内容抽成单个组件,再由页面去引用并控制它的显示隐藏。那么,在中间多出一层封装的情况下,如何同步控制模态框的显示隐藏状态呢?外层页面组件<PriceInfodModal v-model="modalShow" />data(){ return { modalShow: false // 控制且同步模态框显示隐藏的变量 }}..
2021-01-11 00:20:16 1112 1
原创 umi 的项目中如何修改 favicon
浏览器在解析html文件时会将类型为icon的link标签引用的图片作为网页的favicon,也就是网站标签左上角的小图标。有两种方法加入link标签:1. 在document.ejs中使用link标签<head> <link rel="icon" type="image/x-icon" href="favicon.ico" /></head>umi 约定如果存在src/document.ejs 文件,则将其作为html模板。2. 在umi配.
2020-07-08 17:07:09 7742 2
原创 umi项目 (或vuecli项目) 自定义环境变量配置
1. config.js 配置文件里的 console 是打印到项目控制台内的,说明这里还是服务器侧在跑的代码2. 项目内import了ct里暴露的变量,执行process.env.REGION,打印在浏览器端,说明这是浏览器跑的代码,所以取不到process.env。3. 后台使用的东西前端用不到,不应该放在ct里呀大哥4. vue取到环境变量是在配置文件里(服务端侧)取到process.env.REGION,然后需要传到浏览器端代码里(utils.js)。vue为了干净,有个限制,vue c
2020-05-25 18:35:48 3214
原创 移动端h5调试方法总结
方法一:使用 Chrome inspect 调试手机页面1. 用USB线连接手机和PC2. 手机调到开发者模式(不同机型不同,可自行搜索)3. PC上打开Chrome浏览器。进入chrome://inspect/#devices。正常情况下会看到对应的手机和页面信息。附:Chrome 官方指导文档https://developers.google.com/web/tools/chrome-devtools/remote-debugging?utm_campaign=2016q3&u.
2020-05-21 18:18:15 3585
原创 react函数组件如何实现ref
// 父组件const PComp = props => { const myRef = useRef() // 初始化一个ref实例 const getChildVal = myRef.current.foo // 获取ref暴露的值 return ( <ChildComp ref={myRef} /> ) // 引用子组件}// 子组件import { useImperativeHand.
2020-05-14 20:34:33 1146
原创 在 Vue + Typescript 项目中使用 eslint 和 Prettier 的配置
先扔出基本配置,能跑通:.eslintrc.jsmodule.exports = { parser: 'vue-eslint-parser', /* 非必须,但只能是该值,详见下文。*/ extends: [ 'plugin:vue/recommended', /* 基本配置,必须 */ 'plugin:prettier/rec...
2020-04-09 16:31:28 5850
原创 iview 分页防止两次触发
问题描述:若当前页码不在第1页,进行切换 page-size 操作,会同时触发on-page-size-change 和on-change 事件。(因为 pageSize 的切换会引发页码跳回第一页。而事件触发顺序是 onSizeChange ->onChange )正常情况下,改变页码 和 切换pageSize 都需要重新请求数据。因此在上述情况下,会触发两次请求,这是不合理的...
2020-04-03 19:16:53 583
原创 打造 NestJS 日志系统
Nest系统日志打印配置入口,这里传入一个自定义日志类。但实际上实现了LoggerService接口的类都可以。 其中BasicLogger 是自定义封装命名的类。 const app = await NestFactory.create<NestExpressApplication>(ApplicationModule, { logger: new NestL...
2020-03-11 18:12:26 6197
原创 nestjs typeorm 条件筛选、排序、分页 常见查询功能的实现
1. 准备工作:注入Repository,创建queryBuilder@Injectable()export class TicketDao { constructor( @InjectRepository(TicketEntity) private readonly ticketRepo: Repository<TicketEntity> ...
2020-03-08 13:13:35 18991 1
原创 Linux 上安装 nvm node npm pm2 全家桶
背景:nodejs中台服务需要迁移到新的服务器上,为此需要搭建一套用pm2管理node服务的环境。统一用户名为kredit。安装node/npm方法一:下载安装包,可用wget下载。但是安装目录什么的比较麻烦,所以考虑用自动化安装工具。方法二:自动化安装工具apt-getapt-get 下载安装:sudo apt-get install nodejs但是下载的nod...
2020-01-20 16:44:57 1232
原创 理解 v-model、v-bind、$attrs、 $listener 和 .sync 及其在跨组件数据双向绑定上的应用
目标和内容: 在完全理解 v-model,$attrs, $listener 的基础上,实现父(A)、子(B)、后代(C)的三层组件结构中,A组件和C组件跨越B组件之间的数据双向绑定。一、v-model 的本质<MyList v-model="lovingVue"></MyList><!-- 其实是以下的语法糖 --><MyList ...
2020-01-14 21:39:46 6244
原创 开发环境 vue 项目如何关闭 eslint 规则校验
背景(可略):更新代码后,eslint 的空格、缩进等报错会直接导致页面热加载 error。以前不会。非常烦人原因未知,可能是哪里可以配置。回头再研究,当务之急先把eslint 关掉继续开发。项目使用的是 vue-cli-service,这玩意儿把 webpack 等配置包起来了。以前那些诸如配置文件 webpack.base.conf.js 都没有了,一律在 vue.config...
2019-12-26 11:09:43 480
原创 不想在iview表单校验回调函数里写逻辑?试试Promisify吧
const valid = await promisify(myForm.validate, myForm)()if (!valid) { this.$Message.warning('Please Complete the Form!') return}/** * 方法回调promise化 */export const promisify = (f...
2019-10-12 15:18:55 235
原创 打造自己的 grpc 公用服务接口
创建一个 grpc client 实例 // 加载proto文件,生成一个Definition const PROTO_PATH = path.join(__dirname, '../protos/rpc.proto') const packageDefinition = protoLoader.loadSync(PROTO_PATH, { defaults...
2019-10-10 15:41:51 625
原创 爬坑echarts单轴散点图
vue项目,echarts的/lib/component和/lib/chart按需引入。已经引入了散点图的部分import'echarts/lib/chart/scatter'。单轴散点图直接使用例子的option居然会报错。然后找原因。尝试引入4.0.3的min.js的CDN,可以。所以猜测是版本问题,把本地npm包升级到4.0.3,不行。接着尝试import'ech...
2019-09-20 18:55:41 2305
原创 Elasticsearch快速入门 - 增删改查
前言:elasticsearch貌似版本迭代超快,现在网上大多的例子都是老版本的。最新elasticsearch 7.x的版本里type的概念被废弃(https://www.elastic.co/guide/en/elasticsearch/reference/master/removal-of-types.html)。跑在新版elasticsearch下会警告或报错。以下命令符合7.x规范,...
2019-09-03 20:46:27 112
原创 vue打包后报错export not defined
(有可能是包更新了。首先检查队友有否更新npm包,有先npm i一下)修改打包设置(我的是tsconfig.json)"module": "commonJS" 改成 "module": "esnext"或其他...
2019-09-02 14:59:42 1071
原创 iview表单验证 Select错误信息不消失
1. 表单验证的默认规则是字符串数据类型。所以当select的value是数字时,表单验证不通过。解决办法:在规则定义对象中加入属性type:'number'2. 规则定义对象中,如果对Select的校验选择了trigger:'blur',那么假如一开始select为空验证不通过,到后来选择了值理应通过验证,但错误信息是不会消失的。因为blur无法触发select的规则校验。解决...
2019-08-29 18:12:37 4366
原创 iview切换页码触发两次事件
handleChangePageSize(size: number) { this.pageSize = size if (this.curPage === 1) { this.getTreeList() } }handleChangePage() { this.getTreeList() }
2019-08-27 11:48:35 656
原创 vue自定义组件实现sync
// template<Modal :value="modalVisible" title="Common Modal dialog box title" @on-visible-change="handleVisibleChange"> <p>Content of dialog</p> ...
2019-08-22 19:06:02 668
原创 Google 登录流程梳理 [前端与http层]
前台存放项目的client_id和client_secret(从Google官方申请下来的)同时项目引入gapi包,在全局种下gapi变量调用全局gapi.auth2.init方法,传入client_id,获取auth2对象。对auth2对象调用grantOfflineAccess()方法,页面弹出Google登录框。用户在页面上输入登录账号密码回车,触发grantOffli...
2019-08-16 16:55:37 1396
原创 彻底搞懂JS中的的隐式类型转换
看到一篇好文(https://juejin.im/post/5d43bcb36fb9a06b2f5f920f),评论区还有高手打架,旁观者收益不少,因此总结一发。如果== 两侧是不同类型的值,则会引发隐式类型转换。那么转换的规则是什么?什么时候是true或false呢?记住下面几条转换规则,妈妈再也不担心我懵逼规则一:若字符串和数字进行比较,那么字符串转数字。'0'...
2019-08-02 21:47:43 161
原创 原生js实现点击位置出现弹出框
文章重点在于位置获取获取事件点击位置相对client的偏移:event.clientX / event.clientY父元素相对client的位置:parentDom.getClientRects()[0].left / parentDom.getClientRects()[0].top相减得到点击位置相对父元素的偏移,设置为弹出框位置popupDom.s...
2019-07-22 14:10:38 4111
原创 iview结合loading属性手动控制显示隐藏
<Modal v-model="modalVisible" :loading="modalLoading" @on-ok="onModalOk" @on-cancel="modalVisible = false" ></Modal> onModalOk() { if (this.modalType ...
2019-07-16 20:17:56 2471
原创 mac下MySQL修改密码
cd /usr/local/mysql/binmysql -u root -puse mysql网上其他修改密码的sql语句大多是用PASSWORD('xxx')来生成密码,但是我跑下来语法报错。直到使用:ALTER user 'root'@'localhost' IDENTIFIED BY '123456';效果如下:重启数据库后新密码生效...
2019-07-11 12:10:03 181 1
原创 fetch请求到底返回了啥
话不多说,上手代码源自MDN的示例,一跑即知https://developer.mozilla.org/zh-CN/docs/Web/API/Body/json首先新建一个request请求var myRequest = new Request('http://admin.dev.lenteradana.co.id/node/config/get'); request...
2019-07-04 17:33:59 6560
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人