将新状态设置为现有阵列状态

Question

如果我有一个看起来像这样的状态

this.state = {
names: [
"Snap, Crackle, Pop"
]
}

是否可以通过引用现有数组的索引号来创建新状态？

假设这样的事情？这只是一个例子。

this.state = {
names: [
"Snap, Crackle, Pop"
],
myName: this.state.names[0]
}

Answer 1

我会将其设置为componentDidMount：

componentDidMount() {
const { names, myName } = this.state;
if (!myName) this.setState({ myName: names[0] });
}

Answer 2

No.但是您可以只存储索引，以便稍后引用names。

this.state = {
names: [
"Snap, Crackle, Pop"
],
myName: 0
}

是更好的选择。然后

get thisIsMyName() {
return this.state.names[this.state.myName]
}

当您想引用实际名称时。

Answer 3

我认为最简单，最方便的方法是您可以通过以下方式引用现有/以前的状态：

this.setState((prevState) => {
myName: prevState.names[0],
});

另一种方法是将其捕获到变量中，例如：

const myName = this.state.names[0];
this.setState({ myName });