Vue проблема вложенных маршрутов с рендерингом дочернего компонента - PullRequest
0 голосов
/ 07 июня 2018

У меня проблема при использовании вложенных маршрутов vue-router.

https://router.vuejs.org/guide/essentials/nested-routes.html

У меня есть родительский маршрут User и дочерний маршрут UserQuotes, который не отображается.Нет ошибки или предупреждения в консоли.Vue devtools вообще не показывает UserQuotes.

url: http://localhost:8080/user/lagin/quotes

enter image description here

. / Src / router / index.js

import User from '@/components/User'
import UserQuotes from '@/components/UserQuotes'

export default new Router({
    mode: 'history',
    saveScrollPosition: true,
    base: __dirname,
    routes: [
        {
            path: '/user/:name',
            name: 'User',
            component: User,
            children: [
                {
                    path: 'quotes',
                    component: UserQuotes
                }
            ]
        }
    ]
})

. / Src / compoments / User.vue

<template>
    <div v-if="user" class="user">
        <h2>{{ user.name }}</h2>

        <ul class="list-group">
            <li v-for="(value, key) in user" class="list-group-item">{{ key }}: {{ value }}</li>
        </ul>

        <router-view></router-view>
    </div>
</template>

<script>
    export default {
        name: 'user',
        props: {

        },
        data() {
            return {

            }
        },
        computed: {
            user: function() {
                return this.$store.state.user
            }
        },
        methods: {

        }
    }
</script>

./src/compoments/UserQuotes.vue

<template>
    <div class="user-quotes">
        <h2>User quotes</h2>
    </div>
</template>

<script>
    export default {
        name: 'userQuotes',
        props: {

        },
        data() {
            return {

            }
        },
        computed: {

        },
        methods: {

        }
    }
</script>

1 Ответ

0 голосов
/ 07 июня 2018

Я не вижу необходимости в base: __dirname, но, возможно, я что-то упускаю.

Попытка добавить этот параметр в один из моих проектов с вложенными маршрутами, который сломал приложение в аналогичноймода, которую вы описываете.Попробуйте полностью удалить его и посмотрите, решит ли это вашу проблему.

...