No React, existem diferenças reais entre essas duas implementações? Alguns amigos me dizem que o FirstComponent é o padrão, mas não vejo o porquê. O SecondComponent parece mais simples porque a renderização é chamada apenas uma vez.
Primeiro:
import React, { PropTypes } from 'react'
class FirstComponent extends React.Component {
state = {
description: ''
}
componentDidMount() {
const { description} = this.props;
this.setState({ description });
}
render () {
const {state: { description }} = this;
return (
<input type="text" value={description} />
);
}
}
export default FirstComponent;
Segundo:
import React, { PropTypes } from 'react'
class SecondComponent extends React.Component {
state = {
description: ''
}
constructor (props) => {
const { description } = props;
this.state = {description};
}
render () {
const {state: { description }} = this;
return (
<input type="text" value={description} />
);
}
}
export default SecondComponent;
Atualização: Alterei setState () para this.state = {} (obrigado joews). No entanto, ainda não vejo a diferença. Um é melhor que outro?
this.state = { isVisible: props.isVisible }
faz sentido. Depende de como o aplicativo distribui o estado da interface do usuário.