道具未出现在 Svelte DevTools 中答案

【问题标题】：Props not appearing in Svelte DevTools道具未出现在 Svelte DevTools 中
【发布时间】：2019-12-21 18:54:39
【问题描述】：

我正在构建一个应用程序作为学习 Svelte 的一种方式。这一切都运行得很好，但是当我在Svelte DevTools 中查看它时，组件上的道具没有出现，尽管它们的值以数组的形式出现在状态中。我想我一定是做错了什么，但是谁能告诉我什么？

屏幕截图显示了加载了Artist 组件的应用程序。我希望它有一个值为1 的artistId 道具，但它没有。

代码中的page() 函数来自我用于路由的Page.js。

// app.js

import page from 'page'

import App from './views/App.svelte'

const app = new App({
    target: document.body,
    props:  {
        artistId: null,
        route: null,
    },
})

function artist (ctx) {
    const artistId = ctx.params.artistId

    app.$set({
        route:    'artist',
        artistId: artistId,
    })
}

page('/artist/:artistId', artist)
page()

// App.svelte

<script>
    import Artist      from './Artist.svelte'
    import Head        from '../parts/Head.svelte' // sets page titles
    import Home        from './Home.svelte'
    import HomeLink    from '../parts/HomeLink.svelte' // navigation

    export let artistId
    export let route
</script>

<HomeLink route={route} />

{#if route === 'artist'}
    <Artist artistId={artistId} />
{:else}
    <Home />
{/if}

// Artist.svelte

<script>
    import { onMount } from 'svelte'
    import { pageName } from '../stores.js'

    export let artistId

    let artistName

    onMount(async () => {
        // fetches various details from API, sets artistName etc

        $pageName = `Artist details: ${artistName}` // used by Head.svelte
    })
</script>

【问题讨论】：

标签： javascript svelte

【解决方案1】：

这是一个已知问题 - 应该由 https://github.com/sveltejs/svelte/pull/3822 修复

【讨论】：

很高兴知道这不是我！谢谢里奇。