上一页 1 ··· 6 7 8 9 10 11 12 13 14 ··· 45 下一页
2018年8月12日
当music-list向上滑动的时候，设置layer层，随其滚动，覆盖图片，往下滚动时候，图片随着展现出来
摘要： 1.layer层代码： 2.在mounted()的时候，获取图片的高度，并获得其滚动最小高度，即图片的高度-预留的高度； 3.监听ScrollY: 阅读全文
posted @ 2018-08-12 11:40 前端极客 阅读(637) 评论(0) 推荐(0)
开发song-list组件；
摘要： 注意点： 1.song-list的高度是通过计算动态获取的； 2.可以直接在{{}}调用函数，来显示函数的返回值； 阅读全文
posted @ 2018-08-12 10:47 前端极客 阅读(527) 评论(0) 推荐(0)
2018年8月11日
封装一个音乐列表music-list基础组件，可以共用，哪个需要的时候就是哪个props相应的值
摘要： 1.封装music-lsit组件： 2.在singer-detail中引用传值： 阅读全文
posted @ 2018-08-11 18:30 前端极客 阅读(496) 评论(0) 推荐(0)
获取并封装歌手歌曲的数据
摘要： 1.在api/song.js中发送jsonp请求来请求数据 2.封装api/common/js/song.js的song类，来获取想要的信息 3.在sing-detail.vue中请求数据； 4.引入封装的song类，并处理请求到的数据： 阅读全文
posted @ 2018-08-11 17:49 前端极客 阅读(864) 评论(0) 推荐(0)
使用vuex保存singer每个歌星的基本信息
摘要： 1.建src/store文件夹,建立以下文件来存储歌星信息 2.state.js 2.mutations.js 3.mutation-type.js 4.getters.js 5.index.js 6.在singer.vue中引入mapMutations from vuex,并映射到方法中，设置se 阅读全文
posted @ 2018-08-11 11:20 前端极客 阅读(430) 评论(0) 推荐(0)
singer页面点击歌手singer是跳转到singer-detail的设置
摘要： 1.创建components/singer-detail/singer-detail.vue 2.配置动态路由： 3.在listview.vue中emitselectSinger事件来触发选择明星，并将选择的明星item作为参数派发给singer.vue 4.singer中监听派发的selectsi 阅读全文
posted @ 2018-08-11 09:38 前端极客 阅读(531) 评论(0) 推荐(0)
给singer的左侧添加fixedTitle，并显示向上滚动偏移效果；
摘要： 1.将写好的dom绝对定位到顶部； 2.dom值为singerlist的currentIndex.title（通过计算属性获取）,如果有则显示fixedTitle,没有则隐藏； 3.计算diff:当diff小于30，大于0的时候滚动，滚动的距离就是diff-顶部高度即TITLE_HEIGHT; 4. 阅读全文
posted @ 2018-08-11 08:14 前端极客 阅读(176) 评论(0) 推荐(0)
singer页左侧滚动的时候右侧跟随高亮显示
摘要： 1.封装scroll.vue的listenScroll属性和方法，用来确定监听listview.vue的滚动事件 2.将listview.vue的listenScroll属性默认设置为true; 3.写scroll(pos)方法，实时监听左侧scroll位置，并根据滚动位置计算滚动到了索引为哪一个值 阅读全文
posted @ 2018-08-11 08:02 前端极客 阅读(731) 评论(0) 推荐(0)
2018年8月10日
右侧快速入口滑动时左侧跟着变化
摘要： 1 2 3 4 {{item}} 5 6 7 8 9 10 11 事件方法： 12 onShortcutTouchStart(e){ 13 let anchorIndex = getData(e.target, 'index') 14 /... 阅读全文
posted @ 2018-08-10 15:35 前端极客 阅读(311) 评论(0) 推荐(0)
歌手右侧快速入口ABCD....
摘要： 1.通过v-for将右侧内容渲染出来，并绝对定位到右侧 2.给每个li绑定touchStart事件，并绑定自定义属性data-index=index； 3.点击每个li,通过e来获取所绑定的自定义属性中的index; 4.封装scrll中的scrllTo和scrollTlElement方法， 5.给 阅读全文
posted @ 2018-08-10 15:07 前端极客 阅读(518) 评论(0) 推荐(0)
上一页 1 ··· 6 7 8 9 10 11 12 13 14 ··· 45 下一页