反应，我应该从道具设置状态吗？

Question

我总是直接使用props而不将其设置为state，并且效果很好，但是我应该真正从props设置state，然后使用该状态。 有什么不同？

Class A extends Component {
    ...some method,
    render() {
      return <>{this.props.message}</>
    }
}

Class A extends Component {
    constructor() {
       super();
       this.state = {
          message: ''
       }
    }
    componentDidMount(){
       this.setState({message: this.props.message})
    }
    render() {
      return <>{this.state.message}</>
    }
}

Answer 1

如果值相同，则确实没有必要。 考虑到每次使用this.setState()都会导致组件的其他重新渲染。 付出的代价很小，但是如果您说10000条消息，那以后可能会意味着更多。 因此，通过更新state不会提供任何好处。 只需直接使用道具即可。

如果您打算将道具用作中介检查，则更新状态会有些意义。 假设您有这样的事情：

class App extends React.Component{
   state = {
     display: none
   }

   componentDidUpdate(){
      if(this.props.data.length > 0){
        this.setState({
           display: true
        })
      }
   }

   render(){
     <div>
       { this.state.display ? "Show value" : "" }
     </div>
   }
}

我们可以使用道具来更新状态值，该状态值确定是否应显示某些内容。

Answer 2

最好使用props中的数据，而无需更新它来声明仅添加2 3行代码和setState函数的额外执行，但是用户不会有任何不同。