GLTransitions
GLTransitions 是开源的WebGL过渡效果库,包含大量过渡效果,所有效果都能在 AsTransition
中使用。
安装
yarn add gl-transitions
<script src="https://unpkg.com/gl-transitions/gl-transitions.js"></script>
使用
transition
属性
- 将GLTransitions[x].glsl 赋值给
shader
- 将GLTransitions[x].defaultParams 赋值给
uniforms
, 可根据需求修改参数
export interface Transition {
shader?: string
uniforms?: Record<string, any>
}
<script>
import GLTransitions from "gl-transitions";
</script>
<template>
<AsTransition
:transition="{
shader: GLTransitions[0].glsl,
uniforms: GLTransitions[0].defaultParams
}"
...
</AsTransition>
</template>
示例
点击切换过渡效果
Loading CodeSandbox...