点击进入详情页,之前仅仅考虑到只点击“查看详情”按钮进入详情页,然而忽略了用户的交互友好问题,应该点击故宫这一列表的任何区域都可以进入详情页。所以应该在li上加router-link
为了防止页面的抖动,当涉及这些图片加载问题时 ,要记得给图片外层的容器在上【总会忘记】
画廊,可以轮播,底部还有数字,因为考虑到后期可能会有很多这样的轮播,所以讲其设置为公用组件
vue-awesome-swiper的使用以及API整理
https://segmentfault.com/a/1190000014609379
需要将其放到下面,设置bottom: -1rem,随后不见的原因是其父元素设置了overflow: hidden,需要将其删除
依旧没显示原因是这个swiper插件自带了overflow: hidden,需要用到样式穿透使其继承父元素的属性【正常情况下想不到】
逻辑部分:反思
初始时“1”是为了让展开图隐藏,给他定义一个v-show指令,在data中定义初始值showBannershow:false,这样就可以做到隐藏,显示则需要点击Banner 图,所以要给Banner添加一个click事件,让showBannershow:true.