问题标签 [react-spring]

我一直在用 React Spring 制作动画比例。以下工作正常：

但是，当我尝试对高度0进行动画处理时，auto它不起作用。使用 console.log 似乎style道具只是返回height: 'auto'而没有任何转换。

我是 React 的新手，正在学习如何为样式设置动画。我创建了以下动画，在页面呈现时将元素向下移动 50 像素。from、to 和 config 的 props 是 react-spring 库的一部分。

我目前有一个具有上述样式的 div，并且 opacity 与 onclicks 配合得很好，但我在翻译时遇到了问题。基本上我想制作某种滑出 div 的动画。正确的做法是什么？

https://codesandbox.io/s/64mwo66znr

我希望所选元素的 z-index 高于所有其他元素，但是尽管我尝试了一些少数方法，但只有“设置”元素的 z-index 总是更高。

因此，当我单击主页或设置时，选定的 div 应该排在最前面。

在 react.js 应用程序中，我在应用程序状态中存储了一些简单的文本，并传递给将直接显示它的子组件。我想为过渡设置动画，以便当它发生变化时，以前的文本会淡出，然后传入的文本会淡入。

使用 react-spring 怎么可能？

我有一个在页面组件上带有视差组件的网站项目。我正在尝试将 graphql 图像查询响应绑定到背景图像 url 样式属性，但无法弄清楚如何编写它。

这是我的代码：

它是 ParallaxLayer 样式属性的背景图像声明。我想要实现的是在向上滚动时向下滚动和向下滚动时使图像在容器内略微移动，

我在这里先向您的帮助表示感谢。

我想创建一个视差固定页眉效果（固定页眉滚动体），就像这些页面中使用的一样。

http://somethingsplendid.com/

http://jsfiddle.net/KsdeX/1/?utm_source=website&utm_medium=embed&utm_campaign=KsdeX

如何使用react-spring视差来实现它？对于将标题固定在顶部并且所有其他内容滚动直到它覆盖标题然后滚动恢复正常。不知道该怎么做...

谢谢！

每次更改图片组件时，我都会尝试制作动画。页面加载时的第一个动画很好。当我单击“+”按钮时，动画会突然突然回到其最终位置并且不流畅。我不明白为什么会发生这种快照效果。我该如何解决 ？

这是一个代码框片段： https ://codesandbox.io/s/wn6jp23vxl

我是一个新手，试图在我的 React (16.8) 项目中使用 React Spring。我做了一个小旋转木马，它可以工作，但我想在每张幻灯片的底部添加一个应该错开的信用。信用由两个项目组成，第二个应该比第一个慢一点。

为此，我想使用Trail，但是在渲染 Trail 的内容时，动画不会触发。

到目前为止，这是我的代码：

我有一个 div，在对 mouseOver 和 mouseLeave 应用 scale() 变换（使用 react-spring）后，div 的内容在返回到原始 scale(1) 位置后向左移动 1 或 2 个像素。

div 行为的 Gif

这是 Card 组件（使用样式组件）：

这是它被渲染的地方：

任何见解将不胜感激！

编辑：我应该补充一点，如果我将 mouseOut 比例保持在1.0 左右，即 1.00001 或 0.99999，则内容不会像描述的那样移动。理想情况下，我想在不诉诸这种 hack 的情况下解决这个问题，但如果我这样离开它，我应该期待性能受到影响吗？