Vue路由沒有看懂的部分暫時記一下
阿新 • • 發佈:2021-12-23
示例
route/index.js 路由頁面
export default new Router({ mode: 'history', // 去掉url中的# scrollBehavior: () => ({ y: 0 }), routes: [{ path: '/redirect', component: Layout, hidden: true, children: [{//子路由 path: '/redirect/:path(.*)',//動態路由 component: (resolve) => require(['@/views/redirect'], resolve) }] },{//更多路由 ... ... }] })
views/redirect.vue
<script> export default { created() { const { params, query } = this.$route const { path } = params this.$router.replace({ path: '/' + path, query }) }, render: function(h) { return h() // avoid warning message } } </script>
問題:
1./redirect/:path(.*) 表示式上什麼意思 ?
草草看了一下https://github.com/pillarjs/path-to-regexp/tree/v1.7.0 , 待詳細瞭解
2.component: (resolve) => require(['@/views/redirect'], resolve) 上什麼意思 ?
3. 下面程式碼created() 和 render(h) 是Router中的方法嗎 , 裡面的內容是什麼意思
export default { created() { const { params, query } = this.$route const { path } = params this.$router.replace({ path: '/' + path, query }) }, render: function(h) { return h() // avoid warning message } }