svelte - 在 sapper 中更新身体背景颜色

Question

我想根据我所在的页面/路线更新正文背景颜色。到目前为止，我在这个：

//index.svelte
:global(body) {
      background-color:white;
}

//about.svelte
:global(body) {
      background-color:blue;
}

当我从一页转到另一页时，颜色会发生变化，但是当我回到上一页时，它就不起作用了。任何想法 ？？

标签： sveltesapper

Answer 1

当前设置的问题在于，当body您从.indexabout

将样式应用于body: 您可以尝试将<style>元素添加到每个模板的svelte:head元素中。

像这样的东西：

// index.svelte
<svelte:head>
  <style>
    body {
      background: white;
    }
  </style>
</svelte:head>

// about.svelte
<svelte:head>
  <style>
    body {
      background: blue;
    }
  </style>
</svelte:head>

有一些关于添加class:指令<svelte:body>来做这类事情的讨论，所以也许稍后会更新。