svelte：如何使用 await 设置标题？

Question

这将是组件 Product.svelte:

<script>
    import productStore from './product-store';

    export let params = {};

    const id = parseInt(params.id);
</script>

{#await productStore.fetch(id) then product}
    <svelte:head>
        <title>{product.name}</title>
    </svelte:head>
    <h1>{product.name}</h1>
{/await}

这会导致编译错误：

(plugin svelte) ParseError: svelte:head tags cannot be inside elements or blocks

我该如何避免这种情况，以便在选项卡中也获得产品名称？

_{提示：代码可以在没有 svelte:head 元素的情况下运行。 productStore.fetch 是一个异步函数。}

Answer 1

<script>
    import productStore from './product-store.svelte';
        
    export let params = {};

    const id = parseInt(params.id);
    
    const promise = productStore.fetch(id);
</script>

 <svelte:head>
    {#await promise then product}
     <title>{product.name}</title>
    {/await}
</svelte:head>

{#await promise then product}
<h1>{product.name}</h1>
{/await}

svelte：如何使用 await 设置标题？

svelte: How to set the head title with await?

async-await

svelte