1. 程式人生 > 其它 >Vue路由沒有看懂的部分暫時記一下

Vue路由沒有看懂的部分暫時記一下

示例

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
  }
}