子组件的重新排列顺序

我在React Native中写了一个滑块样式导航，在这里滑动了一堆卡片中最顶端的项目，它应该移动到堆栈的底部。子组件的重新排列顺序

但是，由于React Native中没有zIndex，只有元素的顺序，所以我很难将它移动到后面。

给定{this.props.children}中的元素的集合，我怎样才能把最顶层的元素移动到后面并用新的顺序重新渲染组件？

我已经试过了孩子移动的状态，做这样的事情：

this.setState({ 
    children: this.state.children.push(this.state.children.shift()) 
})

但我没有成功。在这种情况下，state.children设置为undefined。

是否有right重新排列元素的方法，因为没有zIndex？

来源

2015-05-12 Magnus Engdal

Array.prototype.push()是一个就地方法，它更新数组并且不返回任何东西。您可以拨打push()和this.setState({ children: this.state.children })。除了setState之外，您还可以使用this.forceUpdate()，因为该状态中的引用并不真正改变。

来源

2015-05-13 07:52:16 Lapixx

谢谢，我注意到有推/移的索姆问题，为什么它返回'undefined'。事实上，自从我将一个元素从数组的开始移动到最后，事情正在发生变化。它现在已经修复并且可以工作，但它仍然感觉像是一种非常糟糕的重组组件的方式，以便在React中实现zIndex。 –

数组正在改变，但this.state.children仍然指向相同的数组。这意味着只有查看第一级引用时，“状态”才会改变。我同意这可能不是实现你想要的最好方式。 – Lapixx

是的，我注意到了。用'.splice（0）'解决它来复制数组并替换旧数组。真的很难看，但直到我找到一个更好的解决方案来重新排列子组件。 –

子组件的重新排列顺序

回答

相关问题