Adding brackets [] to the attribute in setState
{ sth: else }
is equal to
{ ["sth"]: else }
or
var id = "sth";
{ [id]: else }
So you basically need it when you want to evaluate the identifier instead of taking it.
This syntax is just another way to set a key of an object without knowing ahead of time what you want it to be called -- a computed property name.
For instance, these two examples accomplish the same thing:
const myNewObject = {
name: 'Joe',
age: 30
}
…
const propName = 'age'
const myNewObject = {
name: 'Joe',
[propName]: 30
}
So in your example– e.target.name
comes from the name
attribute of the input element ("title", in this case). By setting the state's key with [e.target.name]
you're really just setting the title
property of the state.