如何使用一个值的setState工作？

Question

我在使用npm包React-Select

时正在查看一些代码

有趣的是，我看到setState正在被使用：

handleSelectChange (value) {
        console.log('You\'ve selected:', value);
        this.setState({ value });
    },

setState是如何工作的？它只提供一个值？我问，因为我想从我的输入中捕获一件事，然后改变它。但这不符合预期。

handleSelectChange (value) {
        console.log('You\'ve selected:', value);
        this.setState({ value.name });
    },

完整的代码在这里，相当简短：https://github.com/JedWatson/react-select/blob/master/examples/src/components/Multiselect.js

Answer 1

在ES6中使用时

this.setState({ value })

这只是

的简写

this.setState({ value: value })

这里没有其他神奇的事情发生了

为了更清晰，请考虑此示例

var x = 5
var y = 10
var z = { x, y }
console.log(z)
//=> { x: 5, y: 10 }

如果你想将状态设置为value.name，如果你必须设置的密钥仍然被调用value

，你将无法使用速记

this.setState({ value: value.name })

Answer 2

这是ES2015功能the property name shorthand。当您为其指定同名变量的值时，它可以避免键入密钥的名称。