- 博客(49)
- 收藏
- 关注
RSS订阅原创 原型和原型链
本文已参与「新人创作礼」活动，一起开启掘金创作之路。由于有些东西总是忘记，简单记录下原型链和继承的那些事，构造函数创建对象通过构造函数创建的对象可以拥有构造函数的属性构造函数在new时被自动调用constructor 构造函数instanceof 验证对象的是某个构造函数的实例jsfunction Person(name,age) { this.name = ...
2022-07-31 00:13:51
84
原创 react-useState
本文已参与「新人创作礼」活动，一起开启掘金创作之路。初始值初始值只在第一次渲染的时候获取jsconst [count, setCount] = useState(0);2. 可以接受一个值，也可以接受一个函数jsconst [count, setCount] = useState(() => { return 1;});不会覆盖和Class的se...
2022-07-29 17:51:17
86
原创 表单验证封装
本文已参与「新人创作礼」活动，一起开启掘金创作之路。以react项目antd组件库的使用为例简单介绍rule规则我们一般自定义rule的时候是这样的：一个规则中一般必填之类的则，直接用，required,max,min等，如果需要用正则，则可以用pattern等，如果这样还无法满足验证的复杂度，就可以写validator作为自定义判断```js ...
2022-07-28 18:27:02
95
原创 plugin-access控制路由权限
本文已参与「新人创作礼」活动，一起开启掘金创作之路。umi提供了一个可以控制权限的插件plugin-access插件用法plugin-access约定在/access.js文件定义路由权限。文件返回：该文件默认导出一个函数，函数返回一个对象，函数默认传入initialState，对象里每个数据的值都为一个布尔值，表示这个变量的是否有权限。函数返回值：默认返回一个对象，对象的...
2022-07-27 18:16:00
126
原创 web常忘面试题
本文已参与「新人创作礼」活动，一起开启掘金创作之路。1. 原始数据类型和引用类型的区别 原始数据类型是栈存储，是系统自动分配，并且自动释放的， 而引用类型是堆存储，是动态分配的内存，并不会自动释放。2. 栈内存和堆内存 添加链接描述3. null和undefined的差异 null转换为数字为0，而undefined转换成数字为NAN undefined代表声...
2022-07-26 21:06:22
27
原创 版本控制工具-Git
本文已参与「新人创作礼」活动，一起开启掘金创作之路。Git是开源的分布式版本管理工具。可以让多个计算机去共同开发和处理问题，最终同步到一个结果上。Git和SVN的差别关注重点不一样，改变后的文件快照，文件内容的具体差异。每次记录有哪些文件作了更新，以及都更新了哪些行的什么内容，Git是关注整个文件库的元数据，在代码的根目录会有.git文件，每个文件都有一个版本号，也可以通过文件的...
2022-07-26 20:24:20
22
原创 antd-Form——getValueFromEvent和shouldUpdate
本文已参与「新人创作礼」活动，一起开启掘金创作之路。当检测表单值发生改变，想做一些操作时，发现有两个属性有同样的作用(但每个属性都不仅限于这个作用)getValueFromEvent：这个方法本来的作用，是为当前表单域赋值，当前表单值发生变化时触发,出发getValueFromEvent的回调函数，回调返回e，可以通过e拿到表单更新的数据，通过返回的值，再次为表单赋值。注意不管是为...
2022-07-22 10:40:41
294
原创 给编辑器设置一个背景
本文已参与「新人创作礼」活动，一起开启掘金创作之路。觉得编辑器视觉疲劳，或者喜欢点图案增加点搬砖乐趣的同学，可以给编辑器设置一个背景图。用到插件background,这个插件本身有自带的一个卡通人物作为北京，但是我想要那种大面积，比较有存在感的背景图，就去自己设置了一下。这里注意，背景图最好是透明的，可以在网上找个图，如果自己不会，可以让UI给扣一下，加个透明背景就ok了。安装插件b...
2022-07-22 10:06:22
37
原创 umi插件-plugin-initial-state和plugin-model
本文已参与「新人创作礼」活动，一起开启掘金创作之路。基于plugin-initial-state， plugin-model插件，在项目中存入和使用全局数据。使用的两个插件的作用plugin-initial-state: 初始化数据管理插件。约定一个地方导出需要共享的数据。plugin-model：一种基于hooks范式的简易数据管理方案，用于全局共享数据。使用plugi...
2022-07-21 17:06:23
284
原创 react-useEffect
本文已参与「新人创作礼」活动，一起开启掘金创作之路。useEffect可以实现class的三个生命周期： componentDidMount、componentDidUpdate、componentWillUnmountjs const [index,setIndex] = useState(0); useEffect(() =>{ setIndex(1); ...
2022-07-20 17:38:52
29
原创 自己封装一个ajax
本文已参与「新人创作礼」活动，一起开启掘金创作之路。手动实现一个简单的ajax, 通过xhr对象，去写个简单的流程。javascriptfunction ajax(url,onSuccess,onFailed) {const xhr = window.XMLHTTPRequest ? new XMLHTTPRequest() : new ActiveXObject();xhr.ope...
2022-07-20 17:03:00
18
原创 $nextTick使用
本文已参与「新人创作礼」活动，一起开启掘金创作之路。在使用Vue的时候我们能发现，我们在数据里面操作了dom，或者改变了数据，并不能立即同步到真实的dom上，也就是立即改变数据后，我们如果要使用dom上的数据的话，发现还是以前的数据。对此，Vue提供了nextTick的方法，在里面可以拿到dom下次更新后的数据。我们分三种常见使用场景来看：### 在未挂载的时候操作dom： 比如在c...
2022-07-19 18:06:10
25
原创 umi基础使用
本文已参与「新人创作礼」活动，一起开启掘金创作之路。1.umi是什么？他是“蚂蚁金服的底层前端框架” 他包含了路由、部署、测试等一些列功能的企业级的可扩展的前端底层框架2.环境// 创建项目 $ yarn create @umijs/umi-app// 安装依赖 $ yarn// 启动项目 $ yarn start// 构建...
2022-07-19 11:48:40
61
原创 react基础
本文已参与「新人创作礼」活动，一起开启掘金创作之路。 本文为整理自己初入react学到的东西以便备忘 我的react之旅是从官网开始,以一个联系项目的启动开始,一周进入公司项目,使用react至今有两个月了,有个空来记录一下,内容简单,有不足或者错误欢迎指出一 如何开始一个react项目(首先我是先去参照官网做了个井字棋,大概体验下使用,总结一下react项目的开始) ...
2022-07-18 18:23:57
20
原创 async和await
本文已参与「新人创作礼」活动，一起开启掘金创作之路。async await是用于声明异步函数的。async 用于修饰函数，await只能在带了async的函数内使用。一. 使用方法const func = async function() { console.log(123); const a = await new Promise((resolve) => ...
2022-07-18 18:22:38
20
原创 Vue生命周期
本文已参与「新人创作礼」活动，一起开启掘金创作之路。生命周期简单介绍下生命周期，生命周期就是每一个Vue实例从创建到卸载的过程，涵盖了从创建实例，初始化数据，编译模板、挂载dom、更新dom、卸载实例等过程。初始化阶段1. *new Vue() * 创建Vue实例2. init event & lifeCycle 初始化事件和生命周期初始化事件，就是初始化...
2022-07-05 18:24:36
26
原创 Vue入门整理
本文已参与「新人创作礼」活动，一起开启掘金创作之路。简介Vue是一个响应式的web视图层框架；响应式： 我们写代码只关注数据，视图随数据变化而变化。 视图层：UI层面的内容 框架和库： 框架是整个应用程序的设计方案，我们要做到一些功能，就必须遵照框架的规则去实现 库是很多方法的集合，是项目中功能的解决方案。我们要实现一些功能，可以自主的去调...
2022-07-05 18:24:24
32
原创 手写一个promise
本文已参与「新人创作礼」活动，一起开启掘金创作之路。学习Promise的A+规范，以及手写一个Promise后，对Promise学习总结平常也有用到过promise来处理异步，先回顾下promise的用法 new Promise((resolve,reject) => {异步操作并改变状态}).then(onfullfilled, onrejected)javascri...
2022-06-30 10:42:29
25
原创 模块化-实现一个简单的CommonJS
本文已参与「新人创作礼」活动，一起开启掘金创作之路。一、需求：首先CommonJS中我们主要实现的内容是：1.模块加载器： 解析文件地址，通过node，这次我们直接给一段代码传入，先不写解析部分2.模块解析器： 执行文件内容二、代码1.创建一个class,定义传参和变量等javascriptclass Module { // 传入模块名称和文件内容(要执行的代码块)...
2022-06-29 10:41:21
41
原创 模块化基础
本文已参与「新人创作礼」活动，一起开启掘金创作之路。JS语言刚开始只是为了处理一些页面上的交互效果，后来逐渐形成一门复杂的语言，在实现的功能越来越复杂，项目越来越大时，也开始像其他语言一样分文件开发，将每一个文件定义为一个module,在需要使用的模块引入这个module以引用这个模块暴露出来的接口，并且不让其污染全局作用域常用的模块化规范有： CommonJS、AMD、CMD、ESM...
2022-06-29 10:33:17
26
原创 vue-transition、slot等
本文已参与「新人创作礼」活动，一起开启掘金创作之路。本文主要记录一下Vue中transition、slot、mixin、filter、plugin的用法一.transition路由切换动画实现路由向左切换，向右切换的动画。1.定义多个跳转路由定义路由的深度，用于判断路由的方向javascript{ path: "/", name: 'home', c...
2022-06-28 14:46:14
30
原创 vue前端路由和异步组件
路由前端路由的目的： 在不用请求后端的情况下跳转页面hash路由1.通过改变hash值去改变路由2.通过loacation.hash得到hash值 '#/curriculum'3.监听事件： hashchange：监听hash的改变做出反应history路由1.通过改变hash值去改变路由 2.通过loacation.pathname得到路由 '/md/'3.监听事件： popstate：监听浏览器操作引起的路由变化，比如浏览器的回退4.history还有pushSta
2022-03-15 11:22:38
1549
3
原创 Vue-Cli
Vue-Cli为了用命令创建一个项目模板，将一些配置默认配置到里面，或者创建项目时，让开发者选择配置以生成项目。1.将webpack的打包功能配置到模板中创建一个模板项目创建一个模板目录dd在目录中使用命令 npm inityarn add webpack minimist -D添加bin/index.js，并添加配置到package.json中添加webpack.config.js文件创建一个项目目录demonpm inityarn创建一个index.js作为入口文件在packa
2022-01-24 15:16:54
466
原创 vue-transition&slot&mixin&filter&plugin
一.transition路由切换动画实现路由向左切换，向右切换的动画。1.定义多个跳转路由定义路由的深度，用于判断路由的方向{ path: "/", name: 'home', component: Home, meta: { depth: 1 }},{ path: "/list", name: 'list', component: List, meta: { depth: 2 }
2021-12-30 22:48:31
439
原创 vue2从入门整理
简介Vue是一个响应式的web视图层框架； 响应式： 我们写代码只关注数据，视图随数据变化而变化。 视图层：UI层面的内容框架和库：框架是整个应用程序的设计方案，我们要做到一些功能，就必须遵照框架的规则去实现库是很多方法的集合，是项目中功能的解决方案。我们要实现一些功能，可以自主的去调用库里的方法，还可以自己去定义一个方法实现。引入Vue1.直接cdn引入 <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vu
2021-12-06 18:01:02
506
原创 ajax请求封装
首先手动实现一个简答的ajaxfunction ajax(url,onSuccess,onFailed) { const xhr = window.XMLHTTPRequest ? new XMLHTTPRequest() : new ActiveXObject(); xhr.open("get",url,true); xhr.send(); xhr.onreadystatechange = function () { if(xhr.readyState === 4) { if(xhr.
2021-11-30 21:49:34
521
原创 最近看到需要去学习的点（持续记录）
js/css沙箱隔离？为什么要隔离？微前端是怎样做css隔离的？webpack和vite的区别？bundle.js打包和不打包的对比？先去了解下vite?微前端有哪些方式？基础原理？
2021-11-08 23:18:42
494
原创 react-hooks之useEffect
useEffect可以实现class的三个生命周期： componentDidMount、componentDidUpdate、componentWillUnmount记录一个情况 const [index,setIndex] = useState(0); useEffect(() =>{ setIndex(1); console.log(index); })这种第二个参数不写，是什么时候执行？实现了哪个生命周期？答案：这种情况实现了两个生命周期，一个是载入后compo
2021-10-14 17:58:29
124
原创 Promise学习-手写一个promise
学习了Promise的A+规范，以及手写一个Promise后，我对Promise学到的结果。平常也有用到过promise来处理异步，先回顾下promise的用法const myPromise = new Promise((resolve,reject) => { //写一些异步操作，比如ajax请求 if(window.onError){ reject('页面加载失败'); } setTimeout(() => { resolve('异步返回结果'); }, 1000)
2021-10-09 17:22:21
1589
原创 web问题整理
1.原始数据类型和引用类型的区别原始数据类型是栈存储，是系统自动分配，并且自动释放的， 而引用类型是堆存储，是动态分配的内存，并不会自动释放。2.栈内存和堆内存添加链接描述3.null和undefined的差异null转换为数字为0，而undefined转换成数字为NANundefined代表声明了一个变量但是没有赋值null是一个特殊对象，初始值设置为null的对象或变量会被回收4.面向对象三大要素封装 继承 多肽5.面向对象和面向过程的区别吗面向对象是研究所有情况下对象的表现和变化
2021-08-23 18:33:32
78
原创 给编辑器设置个自定义背景
安装插件background,这时配置的背景是插件自带的图片ctrl+shift+p打开首选项设置json文件，找到background配置的地方，修改或添加自定义的图片地址，调整样式。完整配置如下: "background.customImages": [ "file:///G:/img/bgc.png" //图片地址 ], "background.style": { "content": "''", "pointer-ev..
2021-08-18 10:52:08
2655
原创 ie兼容问题
umi版本3.2.14配置原因： 由于项目过于重，想要设置少加载一部分依赖，配置： config.ts, ie不能页面加载不出来nodeModulesTransform: {type: ‘none’,exclude: [],},暂时没有找到解决方案，没有继续配置。...
2021-06-08 14:18:22
171
原创 vsCode好用插件记录
Webstorm IntelliJ Darcula ThemewebStorm主题，就那种不黑不灰的颜色，但是我觉得这种色在台式机上用比较容易反光
2021-05-31 11:38:21
426
2
原创 跳转系统设置token
如果从一个完整的有登陆的项目跳转到另一个项目的一个页面，或者是用iframe在页面中链另一个项目的页面，为了直接免登录进入页面，我们需要将token设置到项目约定的地方。
2021-04-27 12:01:13
703
原创 getValueFromEvent和shouldUpdate
getValueFromEvent：为当前表单域复制，当前表单值发生变化时触发<ProFormRadio.Group name="isAllowPrepay" rules={[{ required: true, message: '请选择是否允许提还' }]} getValueFromEvent={(e) => { const { target } = e; const { value } = target; setAllowPrepay(val
2021-03-31 18:00:39
2432
原创 umi插件------plugin-initial-state
初始化状态数据,全局可调用获取并设置初始化数据export async function getInitialState(){ const user = await getUserInfo(); const token = await getToken(); return { user, token, };}调用已经设置的初始化数据import { useModal } from 'umi';const { initialState, loading, error, re.
2021-01-29 17:17:12
5018
原创 git stash
git stashstash是藏匿的意思，顾名思义，这段代码是隐藏一段代码。git stash常用于解决冲突当拉取代码出现冲突报错时，用git stash将本地修改的代码隐藏掉，这样代码就恢复到了上次拉取之后的状态，再拉取代码就不会报错。这个时候再释放掉stash的代码，处理已下载代码和本地代码的冲突git pull => 拉取报错 => git stash => git pull => 拉取成功 => git stash pop => 处理冲突…stash.
2021-01-25 17:52:40
97
原创 umi使用记录
1.umi是什么？ 他是“蚂蚁金服的底层前端框架” 他包含了路由、部署、测试等一些列功能的企业级的可扩展的前端底层框架2.目录 
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人