1.render
中最好不要放处理数据的逻辑,不能改变props,state
的值,不然render
后又得render
一次,造成多次render
),render
中不要用localStorate
,和sessionStorage
(这算是操作数据,最好让render
之负责展现,术业有专攻).
在组件中,最好不要对props赋值,如果想赋值就用state.因为props可以说是父组件传递的,是固定的。而state是组件自己的,想怎么搞就怎么搞.所以this.props一般在等号的右边;this.state一般在等号的左边。这也是为什么有了props还要有一个state的原因。
2.在pleageRedux
中请求服务器数据,并将结果dispatch
,也可以在结果中再添加一些数据再dispatch
,,这样,在pledge.js
中就可以用this.prop
来获取这些结果了。
3.在willMount
中设置数据setState
,不会render
.而会在willMount
之后render.
4.
class Pledge extends Component{
constants = {
pages: {
...
},
}
state = {
...
}
}
像上面这种情况,可以不用写
constructor(props){
super(props);
}
这时候,系统自动帮你把这一步做了。
如果是UI
组件的话,最好有
static defaultProps = {
}
static propTypes = {
}
5.实现处理的handeler
函数,最好写成
const handler = () => {
}
这样可以自动绑定this
使用最简的
const handler() {
}
则不能自动绑定。
但是render
函数则经常使用
render() {
}
用以简化代码
6.使用以下代码
func = () => {
console.log('sss');
};
结尾要加分号。而使用以下代码,结尾不用加分号。
func () {
console.log('sss');
}
7.当if语句里面没有表达式,只是某个值时 如 if (XXX) 它会自动执行Boolean(xxx)操作, 即 if(XXX) = if(Boolean(xxx))
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。