使用保留字作为支柱名

Question

我想使用class作为组件的道具名，但是我得到了以下错误：

意外关键字“类”。

<script>
  export let class = '';
</script>

<style>
  .foo {
    color: red;
  }
</style>

<div class="{class}">
  <slot />
</div>

在Svelte中可以用保留词作为道具名吗？

Answer 1

通过将不是保留字的道具命名为保留字，然后将其导出为保留字，它就会像预期的那样工作。

REPL

<!-- App.svelte -->
<script>
  import Child from './Child.svelte';
</script>

<Child class="foo">Bar</Child>

<!-- Child.svelte -->
<script>
  let classProp = '';

  export { classProp as class };
</script>

<style>
  .foo {
    color: red;
  }
</style>

<div class="{classProp}">
  <slot />
</div>