› React
This topic created in 1418 days ago, the information mentioned may be changed or developed.
 |
luckycDec 17, 2022
1
动画是 css 的, 和框架没多大关系.
|
 |
3
公司技术栈最新的产品用的是 asp net core 1.1 mvc + jquery ，react 和 ng 都是没事干学着玩的，如果理解的不对欢迎指出
|
 |
jazzg62Dec 17, 2022
4
看看 css 的 animation
|
 |
okakuyangDec 17, 2022
6
react-transition-group
|
 |
8
|
2 |
icebayDec 17, 2022
10
https://motion.ant.design/exhibition-cn/
|
 |
12
这里只说思路，我没仔细看原文的实现。
在页面（路由）的销毁过程过渡 width 、height 至 0 ，在页面（路由）的挂载过渡 width 、height 至目标值。页面的默认大小设置为 0 即可。原理并不复杂，麻烦的是如何配合组件的形态（按钮、卡片）和用途（输入文本、点击响应）实现配套的过渡动画。 |
|
13
我再补充一个，react 、vue 这类库中的“页面”其实并不是真正的某个 html 页面，而是一个 div 元素，因此完全可以利用基于样式表的动画。简单来说 /page/a 和 /page/b 就是 <div id="page-a"> 和 <div id="page-b">。
|
 |
56rhcrivs55TVKdXDec 17, 2022
15
|
|
16
@rabbbit #14 看文档貌似要 Chrome 109+才能用，那意义不大，后台统计一堆用户尤其是国产浏览器那些版本号还在 chrome70~80 间
|
 |
yinchundeDec 17, 2022
17
Flutter 非常好实现，Hero 动画，只要设为同一个 tag 的两个页面的元素，即可做到同样的效果。
|
 |
lyc575757Dec 17, 2022 via Android
20
|
 |
FeaturesDec 17, 2022
21
可以想一想不用框架能不能实现
再用框架降低实现的成本 |
 |
ccraohngDec 17, 2022
22
framer motion
react-flip-toolkit |
 |
wellermanDec 17, 2022
23
先了解一下 css 动画
|
 |
supertanDec 18, 2022
24
讨论啥呢，CSS transition 是实现不了还是咋滴
|
 |
RabbitDRDec 18, 2022
25
基本原理是这个 https://aerotwist.com/blog/flip-your-animations/，可以去搜搜和框架相关的关键词。第一次知道 framer motion ，感觉挺不错的。
|
 |
xiao252Dec 18, 2022
26
Shared Element Transition
|
Select Language