新的一年的第一周get了
1. 如何创建xhr拦截器
override xhr的open方法参考链接
let oldXHROpen = window.XMLHttpRequest.prototype.open;
window.XMLHttpRequest.prototype.open = function(method, url, async, user, password) {
// do something with the method, url and etc.
this.addEventListener('load', function() {
// do something with the response text
console.log('load: ' + this.responseText);
});
return oldXHROpen.apply(this, arguments);
}
2. 当参数为object对象时,如果使用默认参数,怎么做?
const spin = ({color: 'red'}) => {}
// use default params
spin(); // error
span({}); // use dedault params
const spin1 = ({color: 'red'} = {}) => {}
spin1(); // use dedault params
span1({}); // use dedault params
3. 布局是[x-y]——[z]时
参考ruby-china中header的样式
z
通常使用flex布局,将x和y作为一部分
但可以看成类似这样的布局[x]-[y]——[z],y的style为margin-right: auto;
4. 如何提交react的性能
- 减少不必要的渲染why-did-you-update
- 切割组件
- Recompose
- Reselect
- Beware of Object Literals in JSX
上面的code中的<Cropper style={{ maxHeight: 300 }} />
{ maxHeight: 300 }
在每一次render过程中都是一个新的对象,所以Cropper
的render每次都会被执行,可以改成const style = { maxHeight: 300 }; <Cropper style={style} />