Por que definir o estado de um componente de reação fora do construtor?
Então, acabei de baixar o código-fonte de uma estrutura React e estou recebendo este erro no Terminal:
ERROR in ./src/components/TextEditor.js
Module build failed: SyntaxError: Unexpected token (24:8)
22 |
23 | // Set the initial state when the app is first constructed.
> 24 | state = {
| ^
25 | state: initialState
26 | }
27 |
Minha pergunta é: por que as pessoas definem o estado de um componente de reação como este? Qual é o benefício se ocorrer algum erro em algumas pessoas? Além disso, existe uma predefinição ou plug-in Babel que posso obter para evitar esse erro?
É assim que costumo definir o estado de um componente e, pelo que vi, isso é convencional:
constructor() {
super();
this.state = {
state: initialState
};
}
Para o registro, este é o documento inteiro:
// Import React!
import React from 'react'
import {Editor, Raw} from 'slate'
const initialState = Raw.deserialize({
nodes: [
{
kind: 'block',
type: 'paragraph',
nodes: [
{
kind: 'text',
text: 'A line of text in a paragraph.'
}
]
}
]
}, { terse: true })
// Define our app...
export default class TextEditor extends React.Component {
// Set the initial state when the app is first constructed.
state = {
state: initialState
}
// On change, update the app's React state with the new editor state.
render() {
return (
<Editor
state={this.state.state}
onChange={state => this.setState({ state })}
/>
)
}
}