马优晨
码龄7年
  • 3,320,817
    被访问
  • 522
    原创
  • 397
    排名
  • 902
    粉丝
关注
提问 私信

个人简介:生活中的打击和挫折远比想象的更多,有时灾难又会让你的一切努力白费,也许明天我们就会死去,但如果我们还活着,在面对着种种不公和无奈过后,“明天的明天的明天,你是否会依然爱着这个世界。” 我想我会.......................

  • 目前就职: 阿里巴巴
  • 加入CSDN时间: 2014-12-02
博客简介:

马优晨

博客描述:
撰写自己前端开发心得
查看详细资料
  • 8
    领奖
    总分 5,260 当月 179
个人成就
  • 博客专家认证
  • 获得1,036次点赞
  • 内容获得381次评论
  • 获得2,789次收藏
创作历程
  • 13篇
    2022年
  • 57篇
    2021年
  • 91篇
    2020年
  • 168篇
    2019年
  • 158篇
    2018年
  • 53篇
    2017年
  • 40篇
    2016年
成就勋章
TA的专栏
  • 推荐书籍
    2篇
  • 架构
    1篇
  • vue3
    2篇
  • rax
    2篇
  • React Hook
    3篇
  • ice
    1篇
  • uni-app
    1篇
  • flutter
    2篇
  • electron
    3篇
  • 前端开发
    216篇
  • 关于生活
    4篇
  • vant
    3篇
  • express
    5篇
  • 前端算法
    11篇
  • mint-ui
    1篇
  • babel
    3篇
  • turn.js
    2篇
  • 国际化
    1篇
  • vue-awesome-swiper
    1篇
  • 小技巧
    126篇
  • vue
    86篇
  • react
    32篇
  • CSS3
    47篇
  • 小程序
    10篇
  • 概念类知识点
    31篇
  • ECMAScript
    5篇
  • node.js
    14篇
  • PC端
    3篇
  • 咨询
  • IE兼容
    1篇
  • git
    16篇
  • 协议
    2篇
  • 电脑相关
    1篇
  • webpack
    10篇
  • Ant Design
    7篇
  • yarn
    2篇
  • ES6
    15篇
  • ES7
    5篇
  • gulp
    1篇
  • npm插件
    5篇
  • 性能优化
    10篇
  • ESlint
    3篇
  • 编辑器
    7篇
  • Element UI
    11篇
  • 设计模式
    2篇
  • UEditor
    1篇
  • vue-amap
    1篇
  • typescript
    19篇
  • nginx
    2篇
  • mongDB
    2篇
  • 面试
    3篇
  • nw.js
    2篇
  • ES10
    5篇
兴趣领域 设置
  • 前端
    javascriptcssvue.jsreact.jses6webpack前端框架
  • 后端
    node.js
  • 移动开发
    flutter
  • 网络
    https
  • 微软技术
    typescript
  • 小程序
    小程序
  • 职场和发展
    面试
马优晨
You got a dream, you gotta protect it.

个人博客: 点击进入

个人邮箱: 13619228472@163.com
  • 最近
  • 文章
  • 资源
  • 问答
  • 帖子
  • 视频
  • 课程
  • 关注/订阅/互动
  • 收藏
搜TA的内容
搜索 取消

逆商方法论

良材生长不易。风越强劲,树越强壮。所有逆境确实都是让灵魂成长的机会。逆商的这三种呈现形式——新的知识框架、衡量 方法、实践工具,形成了一套完整的体系。通过此体系,人们可 以去了解和改善日常的基本模式,培养自己的抗逆力;有些人拥有高智商,情商也不错,却仍然无法发挥出其潜 能。智商和情商似乎都无法决定成败。尽管如此,两者也都在某 种程度上发挥着应有的作用,但依然还是引出以下这个问题:为 何在同等聪明且适应力强的人中,有些人能坚持到底,有些人却 停滞不前,甚至有些人直接放弃?也许逆..
翻译
发布博客 2022.05.23 ·
7 阅读 ·
0 点赞 ·
0 评论

推荐三本书

《逆商》 攀登者敢于冒险,经受挑战,克服恐惧,坚持愿景,引领风潮,坚持到底,不达目的不罢休。 疫情过后,你所在的企业活着吗? 夫妻俩的结婚证还好吗? 房贷车贷信用卡都还完了吗? 面对这些挫折,你有好的应对方式吗? 如果有,那么这本书对你来说就是锦上添花; 如果没有,那么这本说对你来说就是雪中送炭。 智商衡量的是一个人的智力标准; 情商衡量的是一个人的处事标准; 那面对挫折要用什么商呢? 所谓的逆商,就是指我们是否能再...
原创
发布博客 2022.05.22 ·
40 阅读 ·
0 点赞 ·
0 评论

封装axios请求

通用能力1、正常请求该有的(跨域携带cookie,token,超时设置);2、请求响应拦截器;请求成功,业务状态码200,解析result,不要一层一层的去判断拿数据; http请求200, 业务状态码非200,说明逻辑判断这是不成功的,那就全局message提示服务端的报错 http请求非200, 说明http请求都有问题,也全局message提示报错 http请求或者业务状态码401都做注销操作3、全局的loading配置, 默认开启,可配置关闭(由于后端的问题,经常会让前端加
原创
发布博客 2022.05.09 ·
26 阅读 ·
1 点赞 ·
0 评论

H5唤起APP客户端

唤起APP的方案当前主要有三种打开APP的渠道:流量APP封装渠道,原生的打开渠道以及一些奇技淫巧。流量APP封装渠道微信、手Q和微博等流量入口为了保证流量不流失,对iOS和Android原生的唤起方案做了屏蔽和封装。在这些APP中,使用原生唤起APP方案是无效的,只能用他们的方案或者位于白名单中的APP才能通过H5的唤起APP。如果是腾讯系APP,或者在白名单中肯定是可以的!微博,手机百度等APP也是白名单的打开方式,平常用的不多,这里不做赘述。原生渠道1、 Schema
原创
发布博客 2022.05.09 ·
392 阅读 ·
1 点赞 ·
0 评论

前端常见封装的方法

1、复制文本复制各种自定义的文本,浏览器兼容性高const copyText = (text) => { const clipboardData = window.clipboardData; if (clipboardData) { clipboardData.clearData(); clipboardData.setData("Text", text); return true; } else if (document.execCommand) {
原创
发布博客 2022.04.29 ·
376 阅读 ·
3 点赞 ·
0 评论

PC菜单筛选器

如上图所示,不使用UI库,手写一个筛选器JS代码'use strict';import { createElement, useEffect, useState, Fragment, useCallback, useMemo, useRef,} from 'rax';import View from 'rax-view';import Text from 'rax-text';import Picture from '@ali/rax-pictu...
原创
发布博客 2022.04.14 ·
66 阅读 ·
1 点赞 ·
0 评论

媒体查询media的3种引入方式

利用@media引入在<style>...</style>标签里使用@media来实现媒体查询<style> @media (min-device-width: 300px) and (max-device-width: 500px) { #box { width: 100px; height: 100px; background-color: cadetblue; } }
原创
发布博客 2022.04.09 ·
353 阅读 ·
1 点赞 ·
0 评论

前端的布局方式

自适应布局布局特点:不同设备对应不同的HTML 局部自适应总结:不同的设备用不同的页面或者局部缩放响应式布局布局特点:确保一个页面在所有的终端上,都能显示出令人满意的效果总结:一套方案,处处运行设计思路:使用%或者rem作为单位rem弹性布局布局特点:确为了保证在各种屏幕上的不失真,就要根据实际屏幕宽度做等比例换算总结:一套方案,使用不同的尺寸,分辨率的视口、都能呈现出较好的效果设计思路:使用%或者rem作为单位flex的特殊写法.
原创
发布博客 2022.04.09 ·
53 阅读 ·
1 点赞 ·
0 评论

项目开发流程规范

需求阶段需求文档(背景、收益、详细需求、原型图、A/B实验、埋点) 需求评审(PM-产品经理、RD-研发、QA-测试) 遗留问题修改再次评审研发阶段根据原型图拆分功能模块 评估开发联调排期 技术方案设计 业务代码实现测试阶段测试用例评审 研发自评 正式提测演示 修复BUG上线阶段打包部署 线上验证 数据收集 效果回归学习建议先学使用,在学原理 对比学习,构建体系 动脑动手,大量实践 良好心态,不断进步...
原创
发布博客 2022.04.09 ·
179 阅读 ·
1 点赞 ·
0 评论

npm的使用技巧

一、基本概念npm 全称为 Node Package Manager,是一个基于 Node.js 的包管理器,也是 Node.js 社区最流行、支持的第三方模块最多的包管理器。它的初衷就是让开发人员更容易分享和重用代码。npm 提供了命令行工具,其主要功能是管理Node.js包,包括安装、更新、删除、查看、搜索、发布等。 ​npm 最初只是Node.js 的包管理器,但随着前端技术的不断发展,它的定位变成了广义的包管理器,可以实现JavaScript、React、Vue、Gulp、移动开发等包管理,
原创
发布博客 2022.01.29 ·
1317 阅读 ·
2 点赞 ·
0 评论

antd4中Form.create已废弃

问题:Warning: [antd: Form] antd v4 removed `Form.create`. Please remove or use `@ant-design/compatible` instead.原因:v4 的 Form 不再需要通过Form.create()创建上下文。Form 组件现在自带数据域,因而getFieldDecorator也不再需要,直接写入 Form.Item 即可antd3方案:// antd v3const Demo = ({ f...
原创
发布博客 2022.01.28 ·
767 阅读 ·
2 点赞 ·
1 评论

js动态添加meta标签

有时候我们需要动态添加meta标签和里面的内容,如何添加呢?举例: // 手动添加mate标签 const addMeta = (name, content) => { const meta = document.createElement('meta'); meta.content = content; meta.name = name; document.getElementsByTagName('head')[0].appendChi..
原创
发布博客 2022.01.13 ·
1252 阅读 ·
1 点赞 ·
0 评论

mac关闭指定端口

如何关闭正在运行的3333端口 命令: lsof -i: 端口号 举例: lsof -i: 3333 (2)杀死对用pid进程
原创
发布博客 2022.01.07 ·
1585 阅读 ·
1 点赞 ·
0 评论

nginx 文件说明(非文件配置说明)

nginx.conf文件:server{listen443ssl;server_namelocalhost;ssl_certificate/usr/local/nginx/ssl_ca/wx_okair_net_ee.crt;ssl_certificate_key/usr/local/nginx/ssl_ca/server.key;ssl_session_timeout5m;ssl_protocolsTLSv1TLSv1.1T...
原创
发布博客 2021.12.23 ·
78 阅读 ·
1 点赞 ·
0 评论

2021年10月到12月一个月学习总结2

12月12日1、我们经常无意识的做出选择:比如生气,打人,心情恶略等等; 负面影响:比如头痛,不想做出选择,逃避现实;2、要做有意识的选择:对己对人都有利;以有意识,取代无意识;确认新的价值观,认识危机,培养新的能力;12月20日简单的情绪控制: 1、人了解别人,比了解自己容易; 2、内观,看看自己内部的环境,比如很忙,很饿的时候情绪会很不好; 3、睡觉前,不要吃太多东西,对胃不好,这个就是内观到外观的反应;暂时中断目前的情绪: 1、...
原创
发布博客 2021.12.21 ·
206 阅读 ·
1 点赞 ·
0 评论

2021年10月到12月一个月学习总结

1、《当我谈跑步时谈些什么》这本书中,村上春树讲到自律,到死都要像18岁一样保持热爱; 感悟:喜欢的事情自然可以坚持,不喜欢的怎么也坚持不了;2、北大学长:如何提升专注度 (1)避免假努力 ★ 一边学一边发朋友圈 ; ★ 选错方向做无用功; ★ 感觉自己付出时间精力但是做的东西毫无效率; (2)选择适合自己的学习环境,避免手机信息干扰(社交,娱乐,其他信息)等; (3)使用西红柿法则,间隔30min,...
原创
发布博客 2021.11.26 ·
803 阅读 ·
7 点赞 ·
0 评论

typescript数组,对象,接口实例

一、typeScript 数组1、数组解构 /* let [x:number,y:string,z:number] = [1,'1',3]; 报错,不支持 *//* let x:number; let y:string; let z:Array<number>; let testArray =[0,'nihao',[1,2,3]]; [x,y,z] = testArray; console.log(x,y,z); 不能使用其他类型 */ let
原创
发布博客 2021.11.25 ·
562 阅读 ·
1 点赞 ·
0 评论

typeScript的函数实例

// 1、遍历const myBooks =['白菜','青菜','黄瓜'];myBooks.forEach((title, idx, arr) => console.log(idx + '-' + title));// 2、参数类型和返回类型function createUserId(name: string, id: number): string { return name + id;}const createName = (name:string,age:numbe.
原创
发布博客 2021.11.25 ·
226 阅读 ·
1 点赞 ·
0 评论

ts交叉类型

typeScript 交叉类型是将多个类型合并为一个类型。 这让我们可以把现有的多种类型叠加到一起成为一种类型,它包含了所需的所有类型的特性。interface IPerson { id: string; age: number;}interface IWorker { companyId: string;}type IStaff = IPerson & IWorker;const staff: IStaff = { id: 'E1006', age: 33
原创
发布博客 2021.11.25 ·
193 阅读 ·
0 点赞 ·
0 评论

typescript可辨识联合

如果一个类型是多个类型的联合类型,且多个类型含有一个公共属性,那么就可以利用这个公共属性,来创建不同的类型保护区块。enum CarTransmission { Automatic = 200, Manual = 300}interface Motorcycle { vType: "motorcycle"; // discriminant make: number; // year}interface Car { vType: "car"; // discriminan
原创
发布博客 2021.11.25 ·
151 阅读 ·
0 点赞 ·
0 评论
加载更多