useTheme

Konsta UI 附帶方便的 useTheme Hook，用於偵測由 App 元件 或 KonstaProvider 設定的目前啟用的主題 (ios 或 material)。

<!-- App.svelte -->
<script>
  import { App } from 'konsta/svelte';
  import HomePage from './path/to/HomePage.svelte';
</script>

<!-- set theme on App component -->
<App theme="ios">
  <HomePage />
</App>

<!-- HomePage.svelte -->
<script>
  import { useTheme, Page } from 'konsta/svelte';

  let theme;
  theme = useTheme((newValue) => {
    // to keep it reactive, update value on theme update in parent components
    theme = newValue;
  });

  console.log(theme); // -> 'ios'
</script>

<Page>
  <p>Theme is {theme === 'ios' ? 'iOS' : 'Material'}</p>
</Page>