08 2018 档案
摘要：1 window.onscroll = function() {scrollFunction()}; 2 3 function scrollFunction() { 4 if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) { 5 document.getEle...
阅读全文
摘要：1 .userCard .sanjiao {//三角形的制作； 2 width: 0; 3 height: 0; 4 border-left: 10px solid transparent; 5 border-right: 10px solid transparent; 6 border-bottom: 10px solid rgba(0, 0...
阅读全文
摘要：1 format(interval) {//格式化时间 2 interval = interval | 0//interval为毫秒数 3 const minute = interval / 60 | 0//分钟数为总时间/60 4 const second = this._pad(interval % 60) 5 ...
阅读全文
摘要：1 //使用场景 2 created(){ 3 this.$watch('query',debounce((newQuery)=>{//当搜索值发生变化的时候，将搜索值传递出去 4 this.$emit('query',newQuery )//如果在200ms内再次触发函数，不会调用里面的query事件； 5 },200)) 6 ...
阅读全文
摘要：1 function getRandomInt(min, max) {//返回得到max--min之间的数据，并可以包括max和min 2 return Math.floor(Math.random() * (max - min + 1) + min)//Math.random()返回0-1之间 3 } 4 5 export function shuffle(arr) {//洗牌...
阅读全文
摘要：- 1.定义多个class的目的在于：一般一个class抽取为公共样式，然后用另外一个class定义单独的样式。- 2.对于id和class，我们总结一下：对于页面关键结构，建议使用id。对于小地方，建议使用class。- 3.浏览器标题栏的小图标，想实现这个效果，我们只需要在head标签添加一个l
阅读全文
摘要：1 /*! 2 动画属性： 3 animation-name:动画名称 4 animation-duration:动画时间 5 animation-timing-function:动画的速度曲线 6 animation-delay:动画延迟 7 animation-iteration-count:动画播放次数 8 animation-...
阅读全文
摘要：1.拓展scroll.vue事件 2.在suggest.vue里声明beforeScrll:true,并$emit（beforeScroll）事件 3.在搜索input框中写失去焦点事件： 4.在search.vue父组件中调用子组件的blur方法；
阅读全文
摘要：1.封装扩展scroll.vue功能； 2.在suggest中传值： 3.searchMore方法： a.data声明一个标识位hasMore:true; b.当发送search（）请求，请求后端数据的时候hasMore值为true, c.封装_checkMore()方法，当已经显示条数大于总条数的
阅读全文
摘要：1.搜索框组件： 2.搜索页面组件： 3.搜索列表显示组件 搜索逻辑： 1.suggest.vue是根据搜索关键词来从后台请求数据并展示数据，因此需要props搜索词query; 2.suggest.vue监听搜索词query，当query发生变化的时候发送search请求，并渲染列表 3.父组件s
阅读全文
摘要：原题：父组件搜索页面引用了子组件搜索框，当点击父组件中的热门搜索关键词的时候，将关键词写到子组件的input框中； 1.在组件中写事件，将得到的参数写到搜索框中： 2.父组件中写热门关键词的点击事件： 其中：searchBox指的是子组件的dom 总结：父组件可以通过Dom使用子组件的事件（方法）
阅读全文
摘要：1.在music-list.vue中写DOM 2.传props: 3.在不同的索引前，加上不同的类来显示奖杯： 4.添加类的方法： 5.在music-list中调用时候传入rank
阅读全文
摘要：1.给父元素限制宽高 2.给Scroll限制高度，并overflow:hidden;
阅读全文
摘要：1.下载 2.引入main.js 3.组件中使用
阅读全文
摘要：1.监听audio的timeupdate事件 2.事件方法： 3.格式化时间显示： 4.页面显示：
阅读全文
摘要：1.audio标签 2.中间圆cd和播放/暂停按钮动画 3.通过mutations来设置播放/暂停 上一首/下一首 min/normal播放 4.监听currentsong的变化，当currentsong发生变化的时候,让歌曲播放； 5.监听playing的播放状态 6.上一曲/下一曲切换：
阅读全文
摘要：1.state.js 2.getters.js 3.mutation-types.js 4.mutations.js
阅读全文
摘要：1.缩放图片； 注意：将北京图片的transfomr-origin:top;
阅读全文
摘要：1.layer层代码： 2.在mounted()的时候，获取图片的高度，并获得其滚动最小高度，即图片的高度-预留的高度； 3.监听ScrollY:
阅读全文
摘要：注意点： 1.song-list的高度是通过计算动态获取的； 2.可以直接在{{}}调用函数，来显示函数的返回值；
阅读全文
摘要：1.封装music-lsit组件： 2.在singer-detail中引用传值：
阅读全文
摘要：1.在api/song.js中发送jsonp请求来请求数据 2.封装api/common/js/song.js的song类，来获取想要的信息 3.在sing-detail.vue中请求数据； 4.引入封装的song类，并处理请求到的数据：
阅读全文
摘要：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
阅读全文
摘要：1.创建components/singer-detail/singer-detail.vue 2.配置动态路由： 3.在listview.vue中emitselectSinger事件来触发选择明星，并将选择的明星item作为参数派发给singer.vue 4.singer中监听派发的selectsi
阅读全文
摘要：1.将写好的dom绝对定位到顶部； 2.dom值为singerlist的currentIndex.title（通过计算属性获取）,如果有则显示fixedTitle,没有则隐藏； 3.计算diff:当diff小于30，大于0的时候滚动，滚动的距离就是diff-顶部高度即TITLE_HEIGHT; 4.
阅读全文
摘要：1.封装scroll.vue的listenScroll属性和方法，用来确定监听listview.vue的滚动事件 2.将listview.vue的listenScroll属性默认设置为true; 3.写scroll(pos)方法，实时监听左侧scroll位置，并根据滚动位置计算滚动到了索引为哪一个值
阅读全文
摘要：1 2 3 4 {{item}} 5 6 7 8 9 10 11 事件方法： 12 onShortcutTouchStart(e){ 13 let anchorIndex = getData(e.target, 'index') 14 /...
阅读全文
摘要：1.通过v-for将右侧内容渲染出来，并绝对定位到右侧 2.给每个li绑定touchStart事件，并绑定自定义属性data-index=index； 3.点击每个li,通过e来获取所绑定的自定义属性中的index; 4.封装scrll中的scrllTo和scrollTlElement方法， 5.给
阅读全文
摘要：1 // 请求代理机制： 2 proxyTable: { 3 '/api/**': {//当你的请求是以api开头的时候，将请求转发到当前服务器的8088端口上，只是路径做一个替换，pathRewrite 4 target: 'http://localhost:8088/', 5 pathRewrite:{ 6 '^...
阅读全文
摘要：1 //Tree.vue 2 3 4 5 6 7 {{ model.menuName }} 8 9 10 11 12 13 14 37 52 53 //views/tree/index.vue 54 55 56...
阅读全文
摘要：1 2 3 4 5 6 7 购物车动画 8 66 67 68 69 70 71 72 73 74 75 76 427 428
阅读全文
摘要：1 40 41 42 43 1 //html 2 3 4 5 6 7 8 9 //css 10 @keyframes scale { 11 ...
阅读全文
摘要：1 2 3 4 5 Echarts图表 6 7 8 9 10 11 12
阅读全文
摘要：1.TagsView.vue 2.ScrollPane.vue:是当tagView内容超出一行时候的滚动（将鼠标悬浮在那一行上，不出现滚动条，该行就可以滚动） 3.Store/tagsView.js 4.将tagsView.js引入到store/index.js中 总体功能分析： 1.选择左侧菜单的
阅读全文
摘要：用来将其放到navbar中； Breadcrumb/index.vue
阅读全文
摘要：方式一： 1.安装clipboard:npm install clipboard 2.src/utils/clipboard.js 3.vue代码 方式二：src/directive/clipboard/clipboard.js src/directive/clipboard/index.js np
阅读全文
摘要：1. npm install jszip /npm install script-loader / npm install file-saver 2.功能代码 3.调用代码：
阅读全文
摘要：1.在src目录下创建一个文件(vendor)进入Blob.js和Export2Excel.js 2.npm install -S file-saver 用来生成文件的web应用程序 3.npm install -S xlsx 电子表格格式的解析器 4.npm install -D script-l
阅读全文
