关系this.state和this.props

#1

在渲染子元素的时候，下面两种方法区别大么：

  1. 可以直接在render中使用父组件传入的this.props渲染；
  2. 也可以先声明一个this.state，组件中先用着这个空对象（针对第一次render），然后在componentWillReceiveProps中，把nextProps赋给this.state，这样第二次render的时候会使用props的值

我想问的是这两种有什么好坏区别吗，我个人理解是，state是针对自己组件内部的，我觉得这样赋值好像也无可厚非，不过网上找的一些代码，都是用的第一种方法，但是自己觉得这样render里面的东西是不是太多，而且复用起来，总觉得组织结构不明显。。

#2

子组件内部自己管理state和外部或者父组件管理state的区别。

我认为大部分人都是组件内部管理state，如果需要外部更新，再从外部通过props去更新组件内部的state。你说网上大部分是第1种情况，那是因为redux框架决定的。

自己做项目和开发一个antdsigen有所不同，一个开源react UI库，通常都是组件自身维护state，也可以外部传参去更新。自己做项目，更多考虑的不是复用性，而是场景适用性。

2 Likes
#3

十分感谢您的回答，这里很不好意思再问一个问题：

redux中，当action被dispatch到顶层组件后，子组件要action的话，就需要一层层的this.props传下来，所以途径的这些组件就得写上{…this.props}这样的代码了么。。好累赘啊。。。

#4

不喜欢就不用redux

#5

额你可能误会我的意思了，我只是问是不是这样用的。。。因为自己看的也有限。。都很不确定。。

#6

当从redux里面接收到的数据，只有在componentWillReceiveProps里面做setState操作吗 我在componentDidUpdate里面setState会一直重新渲染

#7

用react-redux的connect方法state映射为子组件的props就行了吧

#8

分情况吧：

  1. 可以直接在render中使用父组件传入的this.props渲染：这种是最清楚的
  2. 也可以先声明一个this.state，组件中先用着这个空对象（针对第一次render），然后在componentWillReceiveProps中，把nextProps赋给this.state，这样第二次render的时候会使用props的值: 这种适合于父组件的 props 传入 子组件后要修改，比如编译表格，需要初始渲染出原有数据，然后又要修改，只能把 props 赋值给 state，然后修改 state 这种方式了
1 Like
#10

componentDidUpdate里面不要setState，会循环的