 | 1 luckyc 2022-12-17 14:53:01 +08:00 动画是 css 的, 和框架没多大关系. |
 | 3 edis0n0 OP 公司技术栈最新的产品用的是 asp net core 1.1 mvc + jquery ，react 和 ng 都是没事干学着玩的，如果理解的不对欢迎指出 |
 | 4 jazzg62 2022-12-17 15:04:27 +08:00 看看 css 的 animation |
 | 6 okakuyang 2022-12-17 15:06:15 +08:00 react-transition-group |
 | 7 IvanLi127 2022-12-17 15:15:18 +08:00 via Android @edis0n0 为啥一定要路由框架，如果就三五个页面，其实直接用元素的隐藏和显示就好了。。/div> |
 | 8 fwh 2022-12-17 15:17:24 +08:00  2 |
 | 10 icebay 2022-12-17 15:22:13 +08:00 https://motion.ant.design/exhibition-cn/ |
 | 12 ragnaroks 2022-12-17 15:30:22 +08:00 1 这里只说思路，我没仔细看原文的实现。 在页面（路由）的销毁过程过渡 width 、height 至 0 ，在页面（路由）的挂载过渡 width 、height 至目标值。页面的默认大小设置为 0 即可。原理并不复杂，麻烦的是如何配合组件的形态（按钮、卡片）和用途（输入文本、点击响应）实现配套的过渡动画。 |
| 13 ragnaroks 2022-12-17 15:38:10 +08:00 1 我再补充一个，react 、vue 这类库中的“页面”其实并不是真正的某个 html 页面，而是一个 div 元素，因此完全可以利用基于样式表的动画。简单来说 /page/a 和 /page/b 就是 <div id="page-a"> 和 <div id="page-b">。 |
 | 14 rabbbit 2022-12-17 15:48:38 +08:00 1 |
 | 15 56rhcrivs55TVKdX 2022-12-17 15:51:25 +08:00 |
| 16 edis0n0 OP @rabbbit #14 看文档貌似要 Chrome 109+才能用，那意义不大，后台统计一堆用户尤其是国产浏览器那些版本号还在 chrome70~80 间 |
 | 17 yinchunde 2022-12-17 18:29:05 +08:00 Flutter 非常好实现，Hero 动画，只要设为同一个 tag 的两个页面的元素，即可做到同样的效果。 |
 | 20 lyc575757 2022-12-17 18:38:33 +08:00 via Android |
 | 21 Features 可以想一想不用框架能不能实现 再用框架降低实现的成本 |
 | 22 ccraohng 2022-12-17 22:28:17 +08:00 framer motion react-flip-toolkit |
 | 23 wellerman 2022-12-17 23:27:58 +08:00 先了解一下 css 动画 |
 | 24 supertan 2022-12-18 00:59:18 +08:00 讨论啥呢，CSS transition 是实现不了还是咋滴 |
 | 25 RabbitDR 2022-12-18 11:24:00 +08:00 基本原理是这个 https://aerotwist.com/blog/flip-your-animations/，可以去搜搜和框架相关的关键词。第一次知道 framer motion ，感觉挺不错的。 |
 | 26 xiao252 2022-12-18 22:51:07 +08:00 Shared Element Transition |
Select Language