本地列表的全局或静态状态

Question

是否有可能Flatlist的所有行都有一个 static state。 我有一个Component，当我单击它时，它只想显示在Flatlist的一行上。当我单击Flatlist的另一行时，Component不应在前一行上呈现，而应在当前单击的行上呈现。

在这里，我有两行Flatlist。我只想为单击的cardview或Play Buton渲染进度栏。 所以我的逻辑是，当我单击“按钮”时，我以某种方式将被点击的Flatlist的行的keyID放在 global state中，这只会呈现被点击的Card View的进度条。 像这样的代码：

{  GlobalState===this.props.key && (<ProgressBar />)}

作为平面列表中每个Row渲染的检查器

Answer 1

我最终在component和prop的prop中使用了全局变量。

在renderItem的{​​{1}}中：

Flatlist中renderItem中的功能

Flatlist

在渲染_play = () => { this.setState({ playState: "playing" }); TrackPlayer.play(); const thisplaying = this.props.item.Key; ProgressBar.setCurrentPlayer(thisplaying);//Here I call to put the Key of Item to the component's global variable }; 的{​​{1}}中使用组件

renderItem

在Flatlist的renderItem中使用的组件{<ProgressBar PlayerKey={this.props.item.Key} /> }中：

ProgressBar.js