项目变量

可以使用项目变量来实现动画的动态化。这些可用于浅色/深色主题、更改节点样式或编辑文本内容。项目变量使用 signal - 允许在动画期间更新变量。

可以通过将字符串化的 json 对象传递给 variables 属性来通过播放器组件添加变量：

<motion-canvas-player
  src="/path/to/project.js"
  variables='{"circleFill":"red"}'
></motion-canvas-player>

也可以使用 makeProject() 添加它们：

export default makeProject({
  scenes: [example],
  variables: {circleFill: 'red'},
});

通过 useScene() 在场景内访问变量：

const circleFill = useScene().variables.get('circleFill', 'blue');