苗条： $: 是什么意思？

【问题标题】：Svelte: What does $: mean?苗条： $: 是什么意思？
【发布时间】：2020-04-01 12:51:57
【问题描述】：

这是一个 Svelte 组件的 sn-p：

<script>
  let radius = 10;
  $: area = Math.PI * radius ** 2;

  // ...
</script>

有人可以在area 变量之前解释$: 的用途吗？提前致谢。

【问题讨论】：

【解决方案1】：

在 Svelte 中是 reactive declaration。

这是 JavaScript 中的有效标签语句，Svelte 将其解释为“只要任何引用的值发生变化，就重新运行此代码”

【讨论】：

【解决方案2】：

这称为反应式声明。就像您的组件在发生更新时重新渲染一样，反应式声明也会发生同样的情况。

<script>
  let radius = 10;
  area = Math.PI * radius ** 2;

  // ...
</script>

这将区域设置为 Math.PI * 10 **2，但稍后可以说一个函数将半径更改为 20。然后区域将不会改变并保持原样。这就是反应式声明派上用场的地方。如果半径发生变化，则重新计算面积并进行更改。

【讨论】：