Warning: React.createElement: type should not be null, undefined, boolean, or number.
解決：https://codereviewvideos.com/blog/warning-react-createelement/
最基礎(chǔ)的語(yǔ)法問(wèn)題：他們之間的區(qū)別{}
import { Posts } from '../components/Posts';
import Posts from '../components/Posts';
2.頁(yè)面跳轉(zhuǎn)
import { browserHistory } from 'react-router'
browserHistory.push('/some/path')
3.不帶參數(shù)和帶參數(shù)的方法
constructor{
super(props)
this.noparams1 = this.noparams1.bind(this)
this.noparams2 = this.noparams2.bind(this)
}
noparams1(){
...
}
noparams2(e){
...
}
params(a1){
...a1...
}
render:function(){
return(
<div>
<p onClick={this.noparams1}>noparams1</p>
<p onClick={this.noparams2}>noparams2</p>
<p onClick={this.noparams1.bind(this,a1)}>params</p>
</div>
);
}
4.componentWillReceiveProps
>this.setState 可以寫在這里面
[官方說(shuō)明參考](https://facebook.github.io/react/docs/react-component.html#shouldcomponentupdate)
此方法要注意 在里面寫多個(gè)action有可能會(huì)死循環(huán)歇万，因此要做很多判斷
5.Webpack打包ES6以及ES7和CommonJs混合React
>[Webpack打包](http://www.onmpw.com/tm/xwzj/web_157.html)
ES7的特性 需要
install babel-preset-stage-0 --save-dev
然后在webpack.config.js加上 stage-0：
query:{
presets:['es2015','react','stage-0']
}
6.fetch send cookie
>默認(rèn)情況下fetch不支持發(fā)送cookies 因此 后臺(tái)可能讀不到session 因此需要加上credentials: 'same-origin'
fetch('/users', { credentials: 'same-origin'})
https://github.com/github/fetch/blob/c23c3f9b3aa3e2bcc8853cc0b1b08830068e6163/README.md#sending-cookies
>>Sending cookies
To automatically send cookies for the current domain, the credentials
option must be provided:
>>This option makes fetch
behave similar to XMLHttpRequest with regards to cookies. Otherwise, cookies won't get sent, resulting in these requests not preserving the authentication session.
Use the include
value to send cookies in a [cross-origin resource sharing](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing) (CORS) request.
fetch('https://example.com:1234/users', { credentials: 'include'})
7.dispatch not found
>如果使用mapdispatchtoprops需要加上dispatch
var mapDispatchToProps = function(dispatch){
return {
addCompany: function(company){ dispatch(addCompany(company)); },
dispatch //其他地方才可以使用dispatch
}
};
8.ref 使用
checkbox
handleChange(e, key){
console.log(key)
console.log(this.refs.inputcheckbox.checked)
}
render() {
return (
<div className="PurCartdiv">
<input type="checkbox" ref="inputcheckbox" onChange={this.handleChange.bind(this, key)}/>
</div>
)
}
