老师,关于点击轮播图跳转问题
来源:7-2 购买详情页 - 添加路由(2)
 
			Willsf
2018-02-25

// slideShow.vue部分代码
<div class="slide-img">
  <a :href="slides[nowIndex].href">
    <transition name="slide-trans">
      <img v-if="isShow" :src="slides[nowIndex].src" alt="">
    </transition>
    <transition name="slide-trans-old">
      <img v-if="!isShow" :src="slides[nowIndex].src" alt="">
    </transition>
  </a>
</div>
// index.vue 部分代码
<slideShow :slides=slides :inv=invTime></slideShow>
// main.js配置路由
Vue.use(VueRouter)
let router = new VueRouter({
  routes: [
    {
      path: '/',
      name: 'index',
      component: IndexPage
    },
    {
      path: '/detail',
      component: DetailPage,
      redirect: '/detail/analysis',
      children: [
        {
          path: 'analysis',
          name: 'analysis',
          component: DetailAnaPage
        },
        {
          path: 'count',
          name: 'count',
          component: DetailCouPage
        },
        {
          path: 'forecast',
          name: 'forecast',
          component: DetailForPage
        },
        {
          path: 'publish',
          name: 'publish',
          component: DetailPubPage
        }
      ]
    }
  ]
})写回答
	2回答
- 
				
				原因是,这里采用a标签 href的方法跳转,而前端路由采用的不是html5模式,所以程序本身就是通过hash(#)来判断路由的。 这是我的旧代码写的不算太好,最好的做法是通过路由的name去跳转,外层a标签改成 <router-link :to="{ name: 'xxx'}"></router-link>https://github.com/fishenal/vuejs-demo-project 这里都是我优化过的项目代码 112018-02-26
- 
				  Willsf 提问者 2018-02-25 只有加入#号 href:'#/detail/count'才能正常跳转,不知道是为什么 00
相似问题
				轮播图实现
				
			
			
			
			回答 1
				左侧是边栏,右侧是内容区的路由问题
				
			
		回答 2
