无论我们在用 Antd 的Input组件，还是原生的 input 标签，都会遇到这样一个问题：我们在设置好了普通的 input 样式的时候，在浏览器自动填充用户名和密码的时候，input 框出现了非预期的样式（Antd 是灰色背景，原生的是黄色背景）。

那么，怎么才能实现想要的效果呢？

直接上代码：

Ant-design 是 React 项目中主流的前端 UI 框架，虽然文档较为全面，但是在使用中还是有很多坑的，本文就集中整理一下。

按需加载

.babelrc 文件

1
2
3
4
5
6
7
8
9
10
11

"plugins": [
    "@babel/plugin-proposal-class-properties",
    [
        "import",
        {
            "libraryName": "antd",
            "libraryDirectory": "es",
            "style": true
        }
    ]
]

在开发中，我们常会遇到倒计时的需求，今天用 react 写一个倒计时，实现在某个系统中，定时检验 token 是否有效，适用于试用帐户等场景。

代码很简单，只不过要注意区分 React 的生命周期，在组件未挂载的时候，也就是componentWillMount生命周期中，发送请求，并添加相应的响应拦截。在componentDidMount生命周期中不断发送请求，在componentWillUnmount生命周期中clearInterval

直接上代码

所有代码示例：http://git.io/vlcpa

4 数据流

PropTypes

提供了一种验证 props 的方式

State

千万不能直接修改 this.state，永远记得要通过 this.setState 方法修改

state 中应只保存最简单的数据，不要保存计算出的值

不要尝试把 props 复制到 state 中，要尽可能将 props 当作数据源

当不需要内部状态、refs 和生命周期函数时，将组件变成函数组件可以减少冗余和复杂性

本文主要讲一下react-spring的用法，顺便说一下如何实现比浏览器规定的最小字体还要小的字体～

在开发中前端经常需要写一些特效，而伸缩特效又是其中较为常见的。但是单纯的伸缩特效又不够有吸引力，很直白，很僵硬。所以我们会采用spring这种弹簧特效，会更加生动。比如说，你要将一个 div 放大到 1.5 倍，spring 在放大过程中会放大到 1.6（你可以自己设定），然后在 1.5 上下波动，逐渐稳定到 1.5。

在 react 中也有一个库，叫 react-spring，一起来看看吧～

最近学习了 Redux 和 React-redux，摘录和总结一下。

Redux

action

强制使用 action 来描述所有变化带来的好处是可以清晰地知道应用中到底发生了什么。如果一些东西改变了，就可以知道为什么变。action 就像是描述发生了什么的指示器。最终，为了把 action 和 state 串起来，开发一些函数，这就是 reducer。reducer 只是一个接收 state 和 action，并返回新的 state 的函数。

HEAD 严格来说不是指向提交，而是指向 master，master 才是指向提交的，所以，HEAD 指向的就是当前分支。

fatal: Could not read from remote repository.的解决办法:

查看远端地址 git remote –v 查看配置 git config --list git status

《ES6 标准入门》学习总结

3 变量的解构赋值

3.4 数值和布尔值的解构

解构赋值的规则：只要等号右边的值不是对象或者数组，就先将其转为对象。

JavaScript 执行（一）：Promise 里的代码为什么比 setTimeout 先执行？

宏观任务的队列就相当于事件循环。在宏观任务中，JavaScript 的 Promise 还会产生异步代码，JavaScript 必须保证这些异步代码在一个宏观任务中完成，因此，每个宏观任务中又包含了一个微观任务队列

Promise 永远在队列尾部添加微观任务。setTimeout 等宿主 API，则会添加宏观任务。

Event Loop

复制基本类型值的时候，会新创建一个。复制引用类型值的时候，只是复制指针，指针指向堆中同一个对象。

5 引用类型

到底是不是数组，可以用.isArray()，instanceof 在多个框架（两个以上全局执行环境）就不好用了

array.push():添加到数组末尾，返回新长度 array.pop():返回数组最后一一项 array.shift():移除并返回第一项 array.unshift():前端添加任意项，返回新长度

sort()排序会将‘15’放在‘5’前面，因为比较第一个字符。可以接收一个用于比较的函数

1
2
3
4

function compare(value1, value2) {
	return value2 - value1;
}
arr.sort(compare);