SunnyQK-CSDN博客

原创正则学习笔记

1. 匹配字符串中括号包含的部分字符串： pathname/[id]/action，需提取出 id这个字段包含括号[]本身/\[(.+?)\]/g去掉括号[]，只匹配内容/(?<=\[)(.+?)(?=\])/g知识点(.+?) 匹配任意字符串?<=tmp 不以tmp 开头...

2021-06-04 16:31:48 105

本文为作者学习next.js框架架构的一些总结，仅出于个人观点，可留言共勉。next版本：最新版源码地址：https://github.com/zeit/next.js1. 项目入口在我们使用next.js进行项目搭建时，package.json是必备的文件，其中scripts则为我们运行development、product等环境的入口，next相关的指令则包括{ "dev": "next dev", "start":"next start", "build": "next build.

2020-05-08 17:44:51 949

原创使用echarts等图表时，y轴动态赋值

// 对y坐标轴的max进行处理// 12 ==> 15// 410 ==> 450// 471 ==> 500// ....function ceilMax(num) { if (num <= 10) return 10; let numL = Math.ceil(num).toString().length; let oNum = Math.rou...

2020-04-23 10:18:49 1542

原创 Next.js+Typescript+Yarn 构建服务端渲染项目（2）

Hi,在上一次分享的基础上，我们今天来了解下UI组件antd在该项目中的使用吧1. 引入Antd组件&babel-plugin-import。这个… 当然是必须的了，我们首先在项目中安装antd的依赖插件；yarn add antd babel-plugin-import -Dz2. 直接在项目中使用 — ???根据使用习惯的话，我们直接在index.tsx中import...

2019-12-31 16:23:53 400 1

原创 Next.js+Typescript+Yarn 构建服务端渲染项目（1）

本章进行基础项目框架的搭建，使用到的技术点包括基础框架：Next.js（一个轻量级的 React 服务端渲染应用框架）构建工具：YarnTypescript后面我们会再了解eslint等工具的引入1. 创建项目目录 1. mkdir next-ts 2. cd next-ts 3. yarn init -y完成以上三步之后你已经创建了一个【next-ts】目录，该目...

2019-12-19 10:24:25 1202

原创 Windows10修改本地hosts文件

Windows10修改本地hosts文件1、cmd + R 打开命令行操作窗口输入本地host文件所在目录，回车打开文件夹。2、使用管理员身份打开host文件操作窗口选择“以管理员身份打开 Windows PowerShell”在窗口中输入 notepad .\hosts打开hosts文件，进行编辑修改即可。...

2019-10-15 16:41:43 3107 1

原创 React Hooks中父组件中调用子组件方法

React Hooks中父组件中调用子组件方法场景：在使用antd的Table组件时，对Table子组件进行了二次封装（<AsyncTable />）;在父组件（<f-comp />）中需要调用<AsyncTable />中的一个函数，对antd原生Table上的dataSouce进行更新。所以，需要子组件中暴露一个函数供父组件调用，可以实时的去对子...

2019-09-27 16:06:04 14476 2

原创前端生成uuid

function getUUid() { const s = []; const hexDigits = '0123456789abcdef'; for (let i = 0; i < 36; i++) { s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1); } s[14] = '4'; ...

2019-07-11 15:25:03 2433

原创 Antd Table组件表头不对齐解决方案

Antd Table组件表头不对齐解决方案背景：在使用Antd的table组件时，由于表头参数过多，于是设置了scroll属性，在其超出一定宽度后进行滚动但是在添加了该属性之后，经常会出现表头不对齐的问题：针对该问题Google 了一下解决方案，但大多不是很完善，为解决问题。现整理下完整的解决方案：1、对表格的每一行【columns】设置width属性（留出一行进行宽度自适应）；...

2019-07-05 11:14:37 9912 1

原创 react-hooks中判断当前点击对象是否属于某一组件。

react-hooks中判断当前点击对象是否属于某一组件。在项目中遇到这种场景，开始是用点击事件的event.path属性去查找点击元素的父节点中是否有某一个class去进行校验的，后来发现在IE中，event.path并不兼容，于是找到了一下处理方案：思路：使用React-dom中的findDOMNode方法，先找到父组件，然后使用contains方法判断点击对象是否属于该组件。直接...

2019-06-20 15:39:25 2355

原创 .gitignore 配置不生效

https://www.cnblogs.com/kevingrace/p/5690241.html背景已经标明忽略的文件目录下的文件，git push的时候还会出现在push的目录中，或者用git status查看状态，想要忽略的文件还是显示被追踪状态。产生原因在git忽略目录中，新建的文件在git中会有缓存，如果某些文件已经被纳入了版本管理中，就算是在.gitignore中已经声明了...

2019-04-30 15:49:35 837

原创 the 'url' property is deprecated

使用next进行开发时，控制台有时会报 Warning: the 'url' property is deprecated查了各种文档之后发现，这个错应该时使用了react-develops开发工具引入的，对项目功能不会有什么影响。因此在尝试了一番之后，禁用了浏览器上安装的react-develops工具，问题解决。...

2019-04-10 13:51:54 831

原创 gitbash 下yarn init报错处理

问题产生原因：node 包问题；解决方案：（二选一皆可）1、使用CMD（windows系统）命令窗口去进行项目初始化； yarn init一路 enter即可；2、使用npm init 初始化项目；// 使用npm初始化项目npm init// 配置淘宝镜像yarn config set registry https://registry.npm.taobao.org...

2019-04-10 09:50:09 686

原创 window10中使用VirtualBox虚拟机安装Ubuntu开发环境

The engine “node” is incompatible with this module. Expected version “>=4 <=9”. Got “11.13.0”yarn config set ignore-engines true

2019-04-08 15:11:30 195

SunnyQK的博客