- 博客(68)
- 收藏
- 关注
RSS订阅
原创 react 实战代码收集（doing）
1、异步useEffect(自定义hook)// 定义function useAsyncEffect(effect: () => Promise<void | (() => void)>, dependencies?: any[]) { return useEffect(() => { const cleanupPromise = effect() return () => { cleanupPromise.then(cleanup =>
2021-11-17 20:17:22
467
原创 koa 和 express 的对比
天冷了，唯有学习来温暖自己。最近利用业余的时间，跟着 coderwhy 老师学习 node.js，了解以及掌握一些服务端的常见知识：确实学习到了很多东西，填充了自己的知识体系的未知领域。node.js 也许是前端开发者踏入服务端开发的最好选择。同样的 JavaScript，同样的语法，以及同样的你，基本上可以达到无缝衔接的开发。对于 node.js 而言，社区里面出现了非常多的框架，快速上手，敏捷开发。 和 就是其中的比较两个突出的框架。express 是一个基于 node.js 平台，快速，开放，极简的
2022-12-04 20:09:27
7335
1
原创 dva-core的基本使用
dva定义dva 是一个基于 redux 和 redux-saga 的数据流方案redux-saga中的几个辅助函数take: 监听action动作，会阻塞后面的代码执行。action被触发后，后面的代码才能执行。（阻塞函数） take(pattern)put: 相当于redux的dispatch，用来触发action 的 effect，然后再reducer中接受。 （阻塞函数） put(action)call: 调用其他的函数，相当于jS中的call方法，其实用法也是差不多的。注意： fn 函
2021-12-21 17:37:33
1551
原创 npm、yarn、cnpm、npx的详解
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）包管理工具npm简介：npm: Node package Manager 称：node包管理器。npm属于node的一个管理工具，所以需要先安装Node。npm管理的包 https://www.npmjs.org/npm管理的包存放地址：发布自己的包是发布到 registry安装的包就是重 registry上下载的npm的配置文件（package.json）对.
2021-11-20 16:16:08
1352
原创 ReactNative路由：react-navigation 6.x 的基本使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）react-native官网的主推方案就是一个单独的导航库react-navigation官网地址https://reactnavigation.org/react-navigation有很多的版本，并且版本的变动还是很大的，对我我刚接触react-native还是从最新的版本开始学习， 最近的版本就是 6.x版本安装yarn add @react-navigation/native .
2021-11-07 17:21:09
3235
1
原创 学习JS(二)： 图解作用域面试题
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）第二集：图解面试作用域面试题面试题：var message = 'copyer'function foo() { console.log(message); // copyer}function bar() { var message = 'james' foo()}bar()在上面的面试题中，答案是 copyer。为什么？这里就涉及到.
2021-10-31 22:38:28
141
原创 JS学习(一)：理解js代码的执行流程
第一集：理解js代码的执行流程想想，当拿到一个网站地址，然后在浏览中打开，就会显示一个页面？ 为什么呢？这其中的过程是怎么样的呢？以 http://www.baidu.com来解释说明。http://www.baidu.com这是一个域名当在浏览器中打开网站的时候，就会通过DNS,把域名解析成一个IP地址然后就会根据IP地址找到对应的服务器,然后服务器就会返回一个 index.html这个index.html文件就是浏览器所展示的内容。在上面的过程中，服务器返回一个index.htm
2021-10-31 21:32:32
252
原创 学习git(八)：git cherry-pick的使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）在最近的项目中，一个同事使用 git cherry-pick，这个指令，我确实看懵了，我根本就没有看到过，所以，就下来了解了一波。学习总是好的嘛。使用场景master分支用来发布版本的dev用来开发的功能模块的在实际的开发过程中，可能遇到这样的情况，所以程序员都早疯狂的写代码，已经在dev分支上完成了 A功能、B功能、C 功能。有一天，老板为了赚钱，要求程序员先把 A功能 和 B 功.
2021-10-17 22:23:52
372
原创 学习git(七)： git rebase的使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）rebase：变基目的： 就是让git的提交记录变得更加的简洁。使用场景1：简化提交记录举例： 组长给你安排了一个大的功能模块（比如说购物车功能），让你自己独立的开发，给你五天的时间。那么你就会从dev分支上，在单独拉去一个分支，开发购物车功能，你每天都会使用git commit来记录你每天的工作量，五天就会产生五个commit，当你交给你组长的时候，这五个commit对你组长来说，是没.
2021-10-17 17:13:32
510
原创 git学习(六)：学习merge的图解
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer） 在最近的工作中，接触到了 git rebase git cherry-pick两个合并指令，它们跟git merge有什么不同，我一无所知。感觉还是知道的太少了。甚至，我对git merge就产生了使用的迷惑。所以，今天又来继续学习一下， git merge这个指令。正题先根据一张图，然后跟着步骤敲命令，慢慢理解merge图画的有点丑，但是大致意思应该都明白。流程开始了。1.
2021-10-17 11:53:39
819
原创 彻底理解react中的props
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）在react中 state 和 props是两个非常重要的属性，并且常用的属性。简单来说：都是用来保存数据状态的。需注意的是state，props的每一次改动都会使页面重新渲染一次。state的解释 state 意为 状态，组件内部的状态。 state是一个可变的属性，控制组件内部的状态 state 一般用于组件内部的状态维护，更新组建内部的数据，状态，更新子组件.
2021-10-14 23:39:27
1924
原创 学习ES6系列：generator的基本认识和使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）## 前言 今天是国庆节的第二天，回到家中，还是比较的无聊，还是写写代码吧。毕竟是个代码小白，需要学习的东西还是很多的，加油吧！ 最近在学习redux-saga这个中间件，它其中的内部代码的原理就是 ES6中的 generator，但是呢？我对其中的ES6的generator就有点陌生，还是不是很理解，所以还是先学习基本的语法吧。 其中的很多话，就是摘抄与阮一峰的ES6的讲解.
2021-10-03 00:25:00
680
原创 您好， useCallback， 重新认识下
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）前言 在前面的项目中敲代码，知道可以用useCallback和 useMemo，但是感觉就是不写，怎么说呢？它们是从哪里进行性能优化的呢？ 以前的， 我的思维陷入了一个误区， 认为 useCallback是对函数的性能优化。其实并不然。 useCallback的性能优化在于： 是否让子组件进行重新渲染上面的都是一些废话，可以不用看；当然最后一句话，还是可以看看，因为最后的.
2021-09-22 00:46:27
438
原创 RN学习(一)：React Navite的环境搭建(详细版)
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer） 最近要接触RN的项目了，所以打算学习一下RN，先学习RN，就必须配置RN的环境变量，RN的环境变量，要求还是挺多的，所以，做个记录，以后就看看自己的博客就行了。 RN的官网地址安装教程： 搭建开发环境 RN 的配置环境：python 2.x （必须）JDK 1.8 也称 8版本， 1.9就直接炸裂node版本大于等于 12Android Studio检查.
2021-09-11 09:40:13
722
原创 antd系列（一）： table中总结栏的使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）参数说明类型summary总结栏(currentData) => ReactNode总结栏的两种情况对表格每页的数据进行总结对表格的整体数据进行总结基础数据的搭建// table 的 columnsconst columns = [ { title: 'Name', dataIndex: 'nam.
2021-09-05 21:41:10
2444
1
原创 antd中的表单的使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）前言 在开发项目中，经常使用表单模块，来完成交互的过程。但是我感觉，在以前开发的过程中，就是直接copy，没有仔细的去理解其中的逻辑，只要现象满足就可以。但是最近项目中想封装一个通用的表单组件，还是必要知道其中的逻辑和各个属性。所以，就回头过来仔细的理一下。使用在antd4中，使用form表单，有着三种不同的方式的写法。普通用法 （所以的布局全在表单中）hooks写法 .
2021-08-29 09:06:25
2148
原创 理解JS中的深比较跟浅比较
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）在理解浅比较跟深比较之前，我们需要先回顾一下==和===的区别== 和 ===的区别==代表相同；===代表严格相同==先检查两个操作数据的类型，如果类型相同，就会===比较；如果不相同，转化为相同的类型，然后再次比较===先检查类型，如果类型不相同，直接返回false；如果相同，再比较简单看下===的比较几种情况（1）如果类型不同，就一定不相等（2）如果两个都是数值.
2021-08-26 22:30:10
404
原创 js 正则学习
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）[\u4e00-\u9fa5] //匹配中文字符 ^[1-9]\d*$ //匹配正整数 ^[A-Za-z]+$ //匹配由26个英文字母组成的字符串 ^[A-Z]+$ //匹配由26个英文字母的大写组成的字符串^[a-z]+$ //匹配由26个英文字母的小写组.
2021-08-25 11:56:38
85
原创 react 异步加载组件的常用方式
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）在react 16.6版本以前，是用的react-loadable来实现异步加载组件的；在16.6版本中已经推出了Suspense来实现异步加载组件分别看看两种方式的实现。react-loadablereact-loadable是一个第三方库，所以需要安装安装npm install react-loadable基本使用//一般的组件的使用import Home from .
2021-08-24 23:16:15
1700
原创 for...in 和 for...of的区别
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）1、对数组的遍历//for...inlet arr = [1,2,3]for(let key in arr) { console.log(key); // 0 // 1 // 2}//for...oflet arr = [1,2,3]for(let key of arr) { console.log(key); // 1 .
2021-08-22 22:14:23
125
原创 学习git(五)： git的标签命令
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）标签作用就是可以清晰的知道项目的版本查看标签git tag//或则git tag --list//如果标签太多，也可以专门查看某一个版本git tag -l "v1.8.5*"/*v1.8.5v1.8.5-rc0v1.8.5-rc1v1.8.5-rc2v1.8.5-rc3v1.8.5.1v1.8.5.2v1.8.5.3v1.8.5.4v1.8.5.5.
2021-08-22 21:52:14
153
原创 学习git(四)：git与远程仓库的连接 (pull 、push)
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）在gitee上创建一个项目，用来管理本地的代码创建完项目之后，有两种情况：第一种，本地还没Git的初始化，就依次执行下面的命令git inittouch README.mdgit add README.mdgit commit -m "first commit"git remote add origin 仓库地址git push -u origin master第.
2021-08-22 10:51:53
1150
原创 学习git(三)： 理解分支以及的基本流程
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）每次提交，Git都把它们串成一条时间线，这条时间线就是一个分支。截止到目前，只有一条时间线，在Git里，这个分支叫主分支，即master分支。HEAD严格来说不是指向提交，而是指向master，master才是指向提交的，所以，HEAD指向的就是当前分支。推荐博客：https://www.cnblogs.com/matengfei123/p/8252128.html创建dev分支和bug.
2021-08-21 23:28:35
159
原创 学习git(二)： 理解git的思想
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）git 是直接记录快照，而不是差异比较差异比较将它们存储的信息看作是一组基本文件和每个文件随时间逐步累积的差异这就说所谓的基于差异的版本控制随着版本的迭代，就是这次的文件和上个版本的文件进行对比git是直接记录快照Git 更像是把数据看作是对小型文件系统的一系列快照。 在 Git 中，每当你提交更新或保存项目状态时，它基本上就会对当时的全部文件创建一个快照并保存这个快照的索引.
2021-08-21 17:44:55
177
原创 学习git(一)：git的基本命令和回滚文件
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）1、git个人配置信息//配置邮箱git config --global user.email "[email protected]"//配置用户名git config --global user.name "xxx"//查看配置信息git config --list2、git对项目进行管理的基本步骤进入要管理的文件夹执行初始化命令npm init查看管理目录下的.
2021-08-21 12:19:35
253
原创 useReducer的基本使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）react的hooks提供了两种state管理的hook：useState 和 useReduceruseState的语法很简单useReducer这个语法也是很简单的，前提是你熟悉redux的reducer。基本用法：接受两个参数import { useReducer } from 'react'//初始化stateconst initState = { count.
2021-08-19 17:53:03
367
原创 学习webpack(七)：路径模块的介绍(resolve)
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）resolve模块解析webpack能解析三种文件路径：绝对路径相对路径在这种情况下，使用import 和 require的资源文件所处的目录，被认为是上下文目录在import / require中给定的相对路径，会拼接次上下文路径，来生成模块的绝对路径模块路径在resolve.modules中指定的所有目录检索模块。默认值['node_modules']，所以默认会从.
2021-08-18 16:49:15
245
原创 学习webpack(六)：本地服务器的搭建
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）为什么要搭建本地服务器？在前面的学习过程中，每次当有代码变动的时候，就需要手动的去打包刷新，这样很很麻烦的。所以，需要自动编译，当代码变化的时候，自动更新。刷新等。webpack提供的几种方式用来自动编译webpack watch modewebpack-dev-server(常用)webpack-dev-middlewarewebpack watchwebpack 提供.
2021-08-18 16:47:06
186
原创 学习webpack(五)：babel的介绍和基本使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）为什么需要babel在前端中有着很多的新语法 ， 比如： ES6， TS，JSX等，他们都需要babel的转化所以，学习Babel对于我们理解代码从编写到线上的转变过程至关重要babel到底是什么呢Babel是一个工具链，主要运用于旧浏览器或者环境中将ES6代码转换为向后兼容版本的JavaScript包括：语法转换，源代码转换等Babel的命令式使用babel本身.
2021-08-18 08:58:28
529
原创 学习webpack(四)：mode的基本使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）//webpack.config.jsmodule.exports = { //设置模式 mode: 'development', //设置source-map，建立js映射文件，方便调试代码和错误 devtool: 'source-map',}Mode配置mode配置选项，可以告知webpack使用相应模块的内置优化默认是是production.
2021-08-17 18:29:18
209
原创 学习webpack(三)：plugin的介绍和使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）认识Pluginplugin也是webpack的核心之一loader是用于特定的模块类型进行转换plugin可以用于执行更加广泛的任务，比如打包优化，资源管理，环境变量注入等CleanWebpackPlugin在前面的学习过程中，每次打包之后，需要手动删除，再次进行打包，这个手动删除的过程，我们就可以只用一个插件帮助我们来完成。安装npm install clean-webpa.
2021-08-17 18:14:40
392
原创 学习webpack(二)：loader的介绍和使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）loader是什么？简单来说，就是对模块的源代码进行解析，转换成浏览器能够认识的代码一、处理css部分css-loader可以将css文件看成是一个模块。是需要通过import来加载这个模块的在加载这个模块的时候，webpack不知道如何对其加载，所以制定对应的loader来完成这个功能安装：npm install css-loader -D那么如何配置loader呢？在哪.
2021-08-17 17:02:41
317
原创 学习webpack(一)：webpack的基本认识和搭建
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）webpack是什么？webpack is static module bundler for modern Javascript applicationswebpack 是一个静态的模块化打包工具，为现代的JavaScript应用程序。打包工具bundler: webpack 可以将帮助我们进行打包，所以他是一个打包工具静态的static： 这样表述的原因是我们最终可以将.
2021-08-17 16:58:10
185
原创 useEffect和useLayoutEffect的区别
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）相同点：都是接受一个函数，一个数组作为参数，但数组里面发生变化的时候，才会重新执行函数不同点：useEffect函数是异步执行的，useLayoutEffect是同步执行的useEffect 的执行时机是浏览器完成渲染之后，而 useLayoutEffect 的执行时机是浏览器把内容真正渲染到界面之前，和 componentDidMount 等价。useLayoutEffect.
2021-08-16 18:22:28
257
原创 v-model的基本使用
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）v-model的使用场景分为两种，一种在表单中，一种在组件中表单中使用v-model的使用原理: 利用v-bind动态绑定value值，v-on监听触发的input事件，来修改value值<template id="james"> // v-bind: value 拿到data中的初始数据 // v-on:input 监听changeMessage事件.
2021-08-15 16:46:25
779
原创 Vue3注册全局属性
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）vue3中注册一个全局属性，在任何的组件都可以使用const app = createApp()app.config.globalProperties.xxx = xxx//这样就注册了一个全局属性结构分离，不能所有的逻辑都写在createApp这个文件里面，需要单独建立文件，然后以中间件的形式插入进来理解app.use()//字符串 vuex vue-routerconst.
2021-08-15 15:47:57
1368
原创 vue的响应式原理解析
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）判断是否继续看这篇笔记这篇纯粹个人学习步骤，练习代码由浅递增的过程，思路一步一步的增进的如果对响应式一点都不了解的人，可以试着看这边笔记，适用于小白（因为我就是小白）如果对响应式知道的比较多，就不用看了，这边收获不大什么是响应式？简单理解就是一个函数中对一个变量有依赖，当变量被改变的时候，这个函数就自动的重新执行，自动更新。const info = { count: 0}fu.
2021-08-14 17:35:38
227
2
原创 vue3中的props分析
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）官网地址：Propsprops的形式数组形式：<my-cpn title="james" :age="12"/> props: ['title', 'age']//书写简单，但是不能类型检测，不能设置默认值对象形式：<my-cpn title="james" :age="12"/> //对象形式一： 只限定类型props: { .
2021-08-11 23:06:57
13497
原创 craco.config.js
const path = require('path')const CracoAntDesignPlugin = require('craco-antd')module.exports = { plugins: [ { plugin: CracoAntDesignPlugin, options: { customizeTheme: { '@primary-color': '#ff0000
2021-08-11 14:51:51
582
1
原创 path.resolve()和path.join()的区别
每天对自己多问几个为什么，总是有着想象不到的收获。 一个菜鸟小白的成长之路（copyer）__dirname 和 __filename 的区别概念解释：__dirname: 表示当前执行node环境的路径__filename: 表示获取当前的执行文件， 简单理解：就是在 __dirname上加上文件的名字代码演示：//app.jsconsole.log(__dirname)console.log(__filename)运行结果：[外链图片转存失败,源.
2021-08-11 14:13:23
128
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人