React项目中优雅的管理多弹窗
项目中,我们经常碰到多弹框的需求,以一个活动为例: - 在活动未开始时,我们需要需要提示用户活动未开始,可以先预约,此时我们有一个组件 Modal1; - 用户预约成功后,给一个预约成功的弹框 Modal2; - 活动开始时,用户参与一些互动,获取积分之类的 Modal3; - 领取成功、领取失败、以及失败的各种理由:Modal4、Modal5...Modaln 虽然有一些Modal我们可以
React骚操作——jsx遇到template-directive
“React 和 Vue 哪个更好?” 论坛上经常看到这样的问题,然后评论区就直接开战了。也有朋友转行做前端,问我该学React还是Vue。几年前,可能确实有必要考虑下到底该选择哪一个,毕竟前端圈子这么乱,谁又知道Vue能走多远?React会不会不维护了呢?可现在两者生态都很不错,Vue确实好用,React学习成本也没有传闻中那么高,template很好用,jsx也更灵活。可以两者都去玩玩,根据
SpringMVC中使用注解清除拦截器
本文描述的是在springmvc中,通过注解清除(跳过)拦截器,支持在Controller类级别或者方法级别来清除,可同时清除多个拦截器。 在开发web后台时,我们的接口一般都需要加权限控制。比如一个简单的场景:用户需要登录后才能访问,没登录就直接跳转登录界面或者返回特定的错误码。通常我们会配置一个拦截器,验证一下用户请求携带的token,如果验证通过就返回true. 这时候有这么一个需求:几
SpringMVC返回结果的封装
我们在写Restful Api时,经常需要返回这种结构的数据: ```json { "code": 0, "data": {}, "msg": "", "error": "" } ``` 其中code方便我们判断操作是否成功,复杂一点可以作为操作码,封装错误类型,比如401为登录过期,当然这不是本文的重点,不做过多描述。data为我们实际需要的数据,msg和error
js定时任务队列
最近在一个项目中,遇到这么一个需求:一个页面中,大概有四五个元素需要按一定次序依次进场,setTimeout来实现吧,仔细一想,那样的代码实在是写不下去,大概是这样的: ```js setTimeout(()=>{ this.setState({view1Visible: true}) setTimeout(()=>{ this.setState({view2V
node.js爬虫应用——前端程序员的词典command-translator
虽然高考英语考了135分,大学英语四级也过了,可到现在,写了两年代码,经常在写一个变量的时候,想半天也想不出来对应的英文单词是什么,总不能很可 (sha) 爱(bi) 的去用拼音吧,最后还是只能去求助有道了。虽然说打开有道网页,然后输入词语翻译不算太麻烦,担保每次都这样,总觉得不够方便,也不够逼格。  先来看看我现在用的工具好了,首先安装command-translator: `c
react-redux中connect的装饰器用法@connect
最近在琢磨react中的一些小技巧,这篇文章记录一下在redux中用装饰器来写connect。   通常我们需要一个reducer和一个action,然后使用connect来包裹你的Component。假设你已经有一个key为main的reducer和一个action.js. 我们的App.js一般都这么写: ```jsx import React from 'react' i
基于React Context Api 和 Es6 Proxy的状态管理
近几个月的工作中,有遇到一些场景:基本不需要全局的状态管理,但页面级的,肯定需要在一些组件中共享,引入Redux这类状态管理库有点繁琐,直接通过props传递的话,写起来总觉得不是那么优雅。刚好项目中React版本比较新,就试了下Context Api,代码大致如下: ```jsx // Context.js const Context = React.createContext( {}
微信小程序request的Promise封装
在我们开发过程中,经常需要附带一个token,所以这里把token单独抽取出来。 可能我们的接口都是以某一个特定的前缀开始的,比如 /api, 所以我们可以提取一个baseUrl,这样后面的请求中就可以不用每次都加上前缀了,而且后期修改也简单,只需要改一下配置文件就可以。 对于后台放回的数据,我们一般会用code来标记是否操作成功。这里可以做一个统一的错误处理,所以这里添加了一个
微信小程序开发——本地调试
在我们开发小程序时,可能小程序端和后台是同时开发的,这种情况下,如果后台代码写一点,再部署到服务器,然后再调试小程序,会很繁琐。而很多小程序api又必须要经过腾讯服务器,再转发到我们自己的后台,这就要求我们的后台能够被外网访问到。前段时间写小程序时尝试过几种方法,这里简单介绍一下。 首先,对于那些不需要调用类似用户登录这些必须要appid的功能,我们可以直接在创建项目的时候,不填app
简化React中的Action的写法,不要中间件,不写dispatch
我们在写React应用时,通常用到redux做状态管理,然后会用到一些中间件来支持异步action,比如redux-thunk.通常我们的代码类似下面这样的: ```jsx //ActionType R.js export ActionType{ TYPE1:'type1', TYPE2:'type2', TYPE3:'type3', // othe
给你的配置文件加上代码提示
> ~~卧槽,scss-loader 的参数是啥来着?又特么得去翻webpack文档~~ 还记得当年在 webpack.config.js 和 webpack.js.org 来回切的场景吗?好不容易配置完webpack,babel.config.js、postcss.config.js ... xxx.config.js 在等着你。 现如今我们基本都有封装自己的脚手架,再也不用面向配置编程了