Animate React重新排列列表项

x

我有一个用于呈现元素列表的JSON对象数组:

mydata.map(thing => {
  return <SomeComponent key={thing._id} />
});

每个渲染的项目都有向上/向下箭头,例如,如果用户单击向上箭头,则该项目将在列表中上移。在后端,只需交换阵列中的项目。

如何使该过程具有动画效果,以便用户更轻松地查看其操作的结果是什么?我一直在研究react-motion,但它似乎基于修改CSS /样式而起作用。我希望会有某种东西可以使用React的key属性来确定唯一元素并基于此来处理运动。

有什么建议么?

沃里利亚兹

React-flip-move是一个很棒的组件,它允许您对子组件进行动画处理。还有一个示例动画,该动画也将列表上的值翻转。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章