赵乘风_i

我又来更新了~简单聊一下我前段时间社招的经历啦~到新公司入职已经两个多月了，从准备面试到确定offer再到入职，就1个半月时间，似乎很快，但这也让我感触颇深。首先是为什么要离开之前的公司呢？面试的时候，每一家hr都会问，谈话的时候，领导也会问。我一直的回答都是两个点，首先是我毕业两年多了，想要寻求一个更大的发展空间，还有一个点就是工资太低了。但一般没有说第二个点，只有再追问时，我会直接说了，因为也没有必要隐瞒，跳槽嘛，大家都心知肚明，大部分原因都是钱没给到位。其实我离开还有一个点就是之前一起毕业进公

收集在业务中经常使用的正则表达式实例，方便以后进行查找，减少工作量。1. 校验基本日期格式 var reg1 = /^\d{4}(\-|\/|\.)\d{1,2}\1\d{1,2}$/; var reg2 = /^(^(\d{4}|\d{2})(\-|\/|\.)\d{1,2}\3\d{1,2}$)|(^\d{4}年\d{1,2}月\d{1,2}日$)$/; 2. 校验...

index是1，2，3阿拉伯数字。但需求是显示一，二，三，四等汉字。switch case就没有必要去实现了， 有一种简易的方式，用到字符串的方法chartAt()，但只适用10以内。设置初始值的时候设置一个汉字的字符串 Han = '一二三四五六七八九十'然后在使用的时候 Han.chart(index) ，就可以拿到对应的汉字。 如果需要适用于所有的阿拉伯数字转汉字，那...

问题：componentWillReceiveProps，在父子组件传值中，如果子组件不能在constructor中通过props拿到值，就使用这个挂载函数。如果需要在子组件中改变父组件传来的值，就直接修改，但是修改后如果更新了props的值，componentWillReceiveProps函数就会再调用一次啊，导致你要修改的值重新初始化，就达不到修改的效果。解决：在父组件中修改这个...

最近项目要走dev测试，在设置了本地代理是xxx域名之后，还需要修改一下本地环境中的hosts文件中的localhost，因为本地启动是localhost:8000，但是代理设置之后，本地启动就是   xxx:8000了。所以需要修改本地localhost修改方法：按照这个路径找到hosts文件，右键打开方式使用记事本打开，编辑加入ps:不要加  #，#  是注释    被这个...

前端没有数据库的概念，不能永久保存， 那么前端数据应该怎么管理呢。1、 原始方法直接在view中定义要使用的数据， 然后传值显示。let data = ['test','test'];<div>{ data[0] }</div> //借助js框架将data可以传递到html中<div>{ data[1] }</div> //借...

修改请求content-type请求接口都是使用的封装好的request，对于post请求统一都是application/json。但是后台同学可能是为了能直接使用之前已有的接口，让我将仅仅这一个的接口请求改为formdata的提交形式，也就是application/x-www-form-urlencoded。之前所有请求都走的request，现在就要修改两种方式修改：1、在req...

前言阅读对象：使用过redux，对redux实现原理不是很理解的开发者。在我实习入职培训的时候，我的前端组长就跟我说过，redux的核心源码很简洁，建议我有空去看一下，提升对redux系列的理解。入职一个多月了，已经参与了公司的不少项目，redux也使用了一段时间，对于redux的理解却一直没有深入，还停留在“知道怎么用，但是不知道其核心原理”的阶段。所以就在github上拉了...

向后台发送params时，特别是在使用筛选项查询的时候，如果某个条件为空，我们的做法是传个空数组或空字符串，但是现在后台的要求是如果值为空，那就不传这个字段值。还有一种适用条件是，如果新建和编辑是同一个页面，那么就可以使用如下的方法，使用同一个params对象，避免在新建的时候传过去的params中有id：null，这种情况。解决办法：id:record.id||undefined...

对于中大型前端项目，项目规范与代码质量尤为重要。当功能需求变更或需要重构时，随心所欲的(糟糕的)代码可能带来比重新开发还麻烦的问题。1 前端项目代码中的常见问题1.1 凌乱的书写风格，阅读体验差这个问题不用作过多阐述，想必接手过他人代码的同学，多少都有些体会。简单来说，太过随意的代码会让强迫症患者难以容忍，难以阅读理解的代码有时甚至不如推倒重来。1.2 低质量的编码，bug 不断...

antd from验证input框只能输入数字问题：Input框中如果只能需要输入Id，也就是数字型字符串，需要进行验证。解决办法对其进行实时正则验证， /^[1-9]\d*$/代码实现：<Form.Item label='ID' > { getFieldDecorator('id', { rul...

fetch和XMLHttpRequest如果看网上的fetch教程，会首先对比XMLHttpRequest和fetch的优劣，然后引出一堆看了很快会忘记的内容(本人记性不好)。因此，我写一篇关于fetch的文章，为了自己看着方便，毕竟工作中用到的也就是一些很基础的点而已。fetch，说白了，就是XMLHttpRequest的一种替代方案。如果有人问你，除了Ajax获取后台数据之外，还有没有...

现在最热门的前端框架有AngularJS、React、Bootstrap等。自从接触了ReactJS，ReactJs的虚拟DOM（Virtual DOM）和组件化的开发深深的吸引了我，下面来跟我一起领略ReactJS的风采吧~~ 章有点长，耐心读完，你会有很大收获哦~一、ReactJS简介React 起源于 Facebook 的内部项目，因为该公司对市场上所有 JavaScript MV...

在浏览器测试的时候，谷歌完全没有问题，但是在safari上出现请求参数全部为null,导致bug出现。一直不知道问题在哪里，在大神指导后发现，safari不识别  -   ，因为有一行代码是    let q = year + '-' + month;  所以在这里就解析出错了。导致错误。解决办法：   将  - 改为  /也就是  let q = year + '/' + mon...

毕业刚到公司，老大让我做一个系统，开发周期20天。遇到了很多问题，首先总结一下在开发之外需要注意的问题，关于开发的问题会在另一篇博客中。1.拿到原型图，首先需要进行分析，将页面布局和逻辑都搞清楚，不要急着开发，有什么问题及时向产品提出。2.和后台定义接口数据，包括格式，避免在联调时出现问题。3.在开发的时候可以看一看有什么模块可以进行复用，写成组件4.如果修改到公共文件，及...

一、预加载图像 如果你的网页中需要使用大量初始不可见的（例如，悬停的）图像，那么可以预加载这些图像。  二、检查图像是否加载 有时为了继续脚本，你可能需要检查图像是否全部加载完毕。  你也可以使用 ID 或 CLASS 替换<img> 标签来检查某个特定的图像是否被加载。 三、自动修复破坏的图像 逐个替换已经破坏的图像链接...

典型的Web应用程序通常由共享数据的多个UI组件组成。通常，多个组件的任务是负责展示同一对象的不同属性。这个对象表示可随时更改的状态。在多个组件之间保持状态的一致性会是一场噩梦，特别是如果有多个通道用于更新同一个对象。举个?，一个带有购物车的网站。在顶部，我们用一个UI组件显示购物车中的商品数量。我们还可以用另一个UI组件，显示购物车中商品的总价。如果用户点击添加到购物车按钮，则这两个组...

对于用户界面而言，展示只占整体设计因素的一半，另一半则是相应用户输入，即通过JavaScript处理用户产生的事件。React通过将事件处理器 绑定到组建上处理事件，事件触发的同时更新组建的内部状态，内部状态更新会触发组件的重绘。因此，如果视图层想要渲染出事件出发后的结果，它所要做的就是渲染函数中读取组件的内部状态。一、绑定事件处理器React处理事件本身和原生的JavaScript事...

在组件的整个生命周期中，随着该组件的props或者state发生改变，它的DOM表现也将有相应的改变，一个组件就是一个状态机，对于特定的输入，它总会返回一致的输出。React为每个组件提供了生命周期钩子函数去响应不同的时刻——创建时、存在期及销毁时。 生命周期方法React的组件拥有简洁的生命周期API，它仅仅提供你所需要的方法，而不会去最求全面。实例化：一个实例出吃被穿件...

使用vsCode批量上传代码，1. 暂存某个文件2. commit信息3. 提交暂存     √     ps: 如果有冲突就解决冲突4. 拉取 (git pull)5. 推送 (git push)

const getYMWeek = (year, month) => { let list = []; let d1; let weekCount; let d = new Date(); // what day is first day d.setFullYear(year, month-1, 1); // 设置时间为2018-01-01...

const getWeek = (date) => { let day=date.getDay(); let no=date.getDate(); let month=date.getMonth()+1; let year=date.getFullYear(); let week=Math.floor(no/7); let remainder...

link路由跳转的遇到的问题：          1: 使用query,data等进行传值，可以在另一个页面拿到值，但是to的跳转不起作用                       解决： 1.去掉link,加点击函数，使用this.props.history.push('./xxxxx')，参数有 to,query,data等。                           ...

做的项目中有一个功能是需要对多个Input组成的list可以新增和删除。刚开始想的解决是直接使用index来做，这个可以新增，但是做不了删除，会出现list错乱的问题，即使是删除中间的某一个，但总也是删除的最后一个。原因是index-1只会删除最后一个，再重新渲染后会刷新列表。如果只是新增但是不填写内容，那么删除了也无所谓，但如果新增后填写再删除就出问题了。解决办法是使用唯一标识符，也...

问题：1、confirm 使用在使用antd的confirm确认时，需要在点击事件发生后关闭弹框。但是confirm提供的关闭只有 确定 按钮。那么就需要自定义关闭弹窗。点击  密码修改页  之后 会打开新的tab页，所以需要弹框在点击之后也关闭。解决：confirm提供了一个弹窗的销毁方法const info = Modal.info({})info.destroy(...

在开发中，我们经常会将一些常用的代码块、功能块进行封装，为的是更好的复用。那么，被抽离出来独立完成功能，通过API或配置项和其他部分交互，便形成了插件。下面这些是我在工作中积累的一些常用的前端开源插件，这里只是罗列出来，详细的用法各个插件官网或者Gayhub都有介绍。注意：往往一个解决方案会有多个插件，需要读者根据自己的实际业务需求进行甄别选用，欢迎留言交流和补充。^_^可以先加个收藏（C...

最近在项目中的一个需求是， 小图点击可以弹框放大，然后能查看原图，顺时针一直旋转，每次90度。实现方法：使用react开发，所以直接选用antd 的组件， Upload 。结合CSS3的旋转属性；查看原图可以直接使用window.open()打开新的标签页。实习代码： constructor(props){ super(props); ...

最近还是一直在进行代码优化前几天进行了一次codeReview，leader给我指出了很多问题1、一个产品的实现是协同的，不要完全按照原型图和后台给的数据去实现，你需要加入自己的思考，参与进去，目的是把产品做得更好，而不是只为了实现需求2、代码hack太多，考虑不足3、命名不规范，有的地方使用了arr，s1，s2等变量，需要改正4、Table  list中的render尽量少写...

上一篇文章是关于从零构建一个webpack项目，基本已经启动成功了，这篇文章将会讲一下在项目中使用目前最流行的React框架1、引入babel相关现代前端基本都是以es6为规范进行开发，所以我们项目中也就需要引入es6。es6是需要使用babel进行转换的，浏览器才能识别npm install --save-dev babel-core babel-loader babel-pres...

在网上看到过很多教程，都是从零开始构建一个项目，每次看着都浩浩荡荡的开始跟着博客一步一步走，但是总是很难成功。自己一直想要从零构建一个项目来实践一下，了解一下偏底层的配置。最近比较有时间，就又一次开始了。不过这次没有盲目的在网上找教程，而是直接打开官方文档webpack，开始实践。 所以给大家的建议也是 学习就直接看官方文档就行，遇到问题再搜索，整那些有的没的，其实...

基本的配置大概已经结束了，现在我们可以使用antd的组件来进行业务开发了。改动的地方是这些新建一个全局菜单文件 layout/index.jsimport React from 'react';import { Layout, Menu, Icon, Breadcrumb } from 'antd';import { withRouter } from 'react-router-do...

前一段时间构建了一个webpack+react项目，最近搞一下vue的相关学习其实在学会了react之后，学其他框架也比较得心应手了，首先就是对比着来学习了，vue官方文档上对于框架的对比有比较好的介绍，可以参考 对比其他框架其实基本给的建议都是先学习Vue会好一些，因为文档更全面，很多库也是官方维护，相比下也比较容易一些，使用模板语法，和html还是比较相似的。首先是基本webpack项目...

之前学习到了 使用vue+webpack构建项目(一)基本配置 这里，这次学习在这个基础项目中引入 vuex、 vue-resource、vue-router等。首先是安装依赖npm i --save-dev vuex vue-resource vue-router element-ui其中vuex 是 状态管理库vue-resource 是 异步加载数据vue-...

大约一个月都没有写文章了，其实有遇到很多问题，但总感觉自己不在状态，也就不能好好静下心来写一点总结，终于这周末可以安安静静的独处一会了。最近在做之前一个项目的重构，上次也大概提了一下，页面和后台服务都是前端同学自己搞，使用的技术栈是 react+ts+mobx+graphql+apollo-client。刚使用起来还是有一定困难，特别是使用 ts时，很多类型问题，如果都用any，那这样的ts是...

原因Nest.js框架，它有效地解决了Nodejs项目中的一个难题：体系结构。Nest旨在提供开箱即用的应用程序，可以轻松创建高度可测试，可扩展，松散耦合且易于维护的应用程序。Nest.js将TypeScript引入Node.js中并基于Express封装什么是NestNest是一个强大的Node web框架。它可以帮助您轻松地构建高效、可伸缩的应用程序。它使用现代JavaScri...

最近二刷了余果的《web全栈工程师的自我修养》，颇有感触，想要和大家分享一下。 第一次看是还在上学的时候，那时刚学前端不久，和很多初学前端的同学一样，想着以后要走全栈开发的路，要学好前端的技能，同时还要掌握数据库，服务端开发等技能，甚至是会点设计和测试，等于说是要一个人包揽整个web项目的开发。在持续的学习和工作中，越来越觉得，全栈可行，但不要轻易尝试。对于初中级前端来说，掌握好...

前端路漫漫，如果想好要走，那就加油吧ps:可以加我微信，关于前端的困惑都可以问我1、前端基础视频 各阶段视频 链接: https://pan.baidu.com/s/1DkKu-uyN0zGPtONUrvXkag 提取码: s99a 2、HTML+CSS+JavaScript思维导图 链接: https://pan.baidu.com/s/1B...

选择某个子菜单时，需要将父菜单也发送过去，后端要判断权限，如果只发子菜单，就做不到匹配，导致父菜单都不会显示在菜单栏。需要解决的问题是antd tree中，父子节点是受控的，默认如果只选择一个子节点，就只把这一个子节点放进数组，如果选择了父节点下的所有子节点，就会将父节点也放进去。现在需要的是，只选择一个子节点的时候，也将父节点放进去。但是antd tree组件没有提供这个属性。于是自己按照后...

对于元素的焦点事件，我们可以使用jQuery的焦点函数focus(),blur()。focus()：得到焦点时使用，和javascript中的onfocus使用方法相同。如： 代码如下 复制代码  $("p").focus(); 或$("p").focus(fn) blur()：失去焦点时使用，和onblur一样。 如： 代码如下 复制代码...

这篇文章主要介绍下笔者看源码的一些心得和方式，由于笔者看的大部分是前端项目，当然也看过一些其它领域的源码，不过不多，所以内容主要还是以前端项目为主了解和熟悉在准备看一个开源项目源码的时候先去熟悉下这个项目的背景、功能以及相应的API。这步为了理解整个项目的功能做准备，也是为了后面重点看哪些模块做准备 查看项目的README.md文件。有些项目会在将设计文档和架构图放到md文件上，这样会让...