在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue-router 起始路徑不是"/"，怎么匹配path？

vue-router 起始路徑不是"/"，怎么匹配path？

我在 "http://localhost/question/123/answer/456" 頁面中使用vue-router，代碼是這么寫的：

var author = {
    template: "#author",
    data: function () {
        return {
            author: json["answer"]["author"]
        }
    },
    methods: {
        getUserLink: getUserLink
    },
}

Vue.component("author", author);

var router = new VueRouter({
    mode: "history",
    routes: [
        {
            path: "/question/:questionId(\d+)",
            components: {
                author: author
            }
        },
        {
            path: "/question/:questionId(\d+)/answer/:answerId(\d+)",
            components: {
                author: author
            }
        }
    ]
});
    
new Vue({
    router,
    el: document.getElementById("root"),
});

HTML代碼：

<html>
<head>
    <base href="/"/>
</head>
<body>
    <div id="root">
        <!-- 省略其他html代碼 -->
        <div class="sidebar">
            <router-view name="author"></router-view>
        </div>
    </div>
    <script id="author" type="text/x-template">
        <!-- 省略author組件內(nèi)容 -->
    </script>
</body>
</html>

期望的效果是：
在 "http://localhost/question/123/answer/456" 頁面會顯示author組件，點擊某個button，不進行頁面跳轉(zhuǎn)，切換到"http://localhost/question/123" ，然后author組件不顯示。

可結(jié)果是在兩個地址下的author組件都不顯示了，我猜會不會是路徑?jīng)]有匹配上？
如果不用vue-router，author組件是能正常顯示的，說明組件沒有問題，
難道只能在 "http://localhost" 頁面中使用vue-router，才能匹配path？

剛用vue-router，不怎么會用，求各位大神指點

回答
編輯回答
陌顏

router 配置有問題

{
            path: "/question/:questionId(\d+)",
            components: {
                author: author
            }
        },

應該改成

{
        path: "/question/:questionId(\d+)",
        component: author
},
2018年3月7日 05:46
編輯回答
念初

我找到問題所在了，多個組件用components沒有錯，單個組件用component，是我的path寫錯了，正則表達式應該是兩個反斜杠：

{
        path: "/question/:questionId(\\d+)",
        component: author
},

至于切換路徑時隱藏author組件的需求，似乎不能通過vue-router來做，還得用v-if或者v-show

2017年6月20日 21:18