part8 详情页面动态路由以及banner布局

1.<router-link>标签 a标签就会把里面文字的颜色变掉

那我们可以换一种写法

<router-link tag='li'>   //这样vue就会把这个标签渲染成li标签
< :to="'/detail' + item.id"> //to做一个动态绑定
//并且实现了一个参数传递,通过url进入路由的时候,把参数带到路径
//但是我们没有这个路由配置 

2.router中配置

{
      path: '/detail/:id',  // 动态路由,后面可以带一个参数 放在id变量里面
      name: 'Detail',
      component: detail,
    }

3.然后再建一个detail 组件 //先不用id值

防止页面抖动  可以做一个宽高自适应

4.渐变效果

 background linear-gradient(top,rgba(0,0,0,.8),rgba(0,0,0,.8))

猜你喜欢

转载自www.cnblogs.com/-constructor/p/12315971.html