我一直在尝试这样做,但我就是不知道怎么做。我在考虑把所有这4个按钮组件放在一个数组中,然后改变位置到第0个索引,如果它是最后一次按下,然后移动所有的按钮到他们的索引+1。有没有更像React的方法来做到这一点?
euoag5mw1#
如果不知道更多,这听起来像是一个令人困惑的用户体验--通常我希望按钮停留在一个位置,除此之外,有很多方法可以做到这一点;这里有一个。你可以保留一个状态对象,将四个按钮的名称作为键,将纪元millis作为值,这样比较上次按下按钮的时间就很容易了。
const [lastPressedTimes, setLastPressedTimes] = useState({ button1: 1, // initial order button2: 2, button3: 3, button4: 4, }); const sortedButtonNames = Object.values(lastPressedTimes) .sort(([, aTime], [, bTime]) => bTime - aTime) // descending order .map(([name]) => name); return ( <> {sortedButtonNames.map((name) => ( <YourButton name={name} key={name} onPress={() => setLastPressedTimes({ ...lastPressedTimes, [name]: new Date().getTime(), })} /> )} </> );
每当按下按钮时,状态将更新,以便最后按下按钮的时间存储在其名称下。
1条答案
按热度按时间euoag5mw1#
如果不知道更多,这听起来像是一个令人困惑的用户体验--通常我希望按钮停留在一个位置,除此之外,有很多方法可以做到这一点;这里有一个。
你可以保留一个状态对象,将四个按钮的名称作为键,将纪元millis作为值,这样比较上次按下按钮的时间就很容易了。
每当按下按钮时,状态将更新,以便最后按下按钮的时间存储在其名称下。