vue编程跳转接口push 转场动画

  • 1.index.js 配置子路由children。
import Vue from 'vue'
import Router from 'vue-router'
import SingerDetail from 'components/singer-detail/singer-detail'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      redirect: '/recommend'
    },
    {
      path: '/singer',
      component: Singer,
      //配置子路由,加一个参数children
      children: [
        {
          //:id 以id为变量,传递一个参数,跳转到不同子路由
          path: ':id',
          component: SingerDetail
        }
      ]
    },
    {
      path: '/search',
      component: Search,
      children: [
        {
          path: ':id',
          component: SingerDetail
        }
      ]
    }
  ]
})
  • 1.Singer
<template>
  <div class='singer'>
    <list-view @select='selectSinger'>list-view>
    //需要用routeview承载子路由
    <router-view>router-view>
  div>
template>

                    
                    

你可能感兴趣的:(vuejs)