useMotionTransitions

useMotionTransitions 用于处理当您为元素添加动画时创建的多个动画。

它公开了 pushstop 两个函数。

公开

push(key, value, target, transition)

Push 函数运行并在当前的 useMotionTransitions 实例中添加一个过渡。

stop(keys | key | undefined)

Stop 是一个函数,允许您停止特定元素的正在进行的动画。

不带参数调用它将停止所有动画。

使用 Motion Properties 键的数组调用它将停止每个指定的键。

使用单个 motion property 键调用它将停止指定的键。

示例

const target = ref<HTMLElement>()

const { motionProperties } = useMotionProperties(target)

motionProperties.x = 0

const { push, stop } = useMotionTransitions()

push('x', 100, motionProperties, { type: 'spring', bounce: 4 })

setTimeout(stop, 4000)