刷新后无法连接到阵列状态

Question

所以这是一个有点棘手的问题。基本上，我所做的是查询Firebase以获取一些信息，然后在列表视图中显示该信息。这第一次有效，但是当我刷新组件时，我的列表视图仅显示我获取的最后一个值。

我的刷新没有问题，所有状态都显示正确的信息，控制台日志指示变量仍然相同。但我似乎不能再附加到我的食谱状态了。

handleUpdateIndex (selected) {
firebase.database().ref('recipes').orderByChild('custard').on('child_added', (snapshot) => {
var variable = snapshot.val();
var first = "variable.";
var last = " === 0";
var joined = this.state.unavailable.join(' === 0 && variable.');
var before = first.concat(joined);
var final = before.concat(last);
if (eval(final)){
console.log(variable)
this.setState({
recipelist: this.state.recipelist.concat(
variable
)
})
}
});
this.setState({selectedIndex : selected})
}

Answer 1

试试这个

this.setState(prevState => ({
recipelist: [...prevState.recipelist, variable]
}));

还要确保你在构造函数中绑定句柄更新索引，如

this.handleUpdateIndex = this.handleUpdateIndex.bind(this);

Answer 2

好的，几个小时后我已经修复了它。

var samples = [];
firebase.database().ref('recipes').orderByChild('custard').on('child_added', (snapshot) => {
var variable = snapshot.val();
var first = "variable.";
var last = " === 0";
var joined = this.state.unavailable.join(' === 0 && variable.');
var before = first.concat(joined);
var final = before.concat(last);
var string = variable.toString();
if (eval(final)){
samples.push(variable);
}
});
this.setState({
recipelist: samples
})