1- import { getStyle } from '../../config/mUtils'
2- import { imgBaseUrl } from '../../config/env'
1+ import {
2+ getStyle
3+ } from '../../config/mUtils'
4+ import {
5+ imgBaseUrl
6+ } from '../../config/env'
37
48export const loadMore = {
5- directives :{
6- 'load-more' :{
9+ directives : {
10+ 'load-more' : {
711 bind : ( el , binding ) => {
812 let windowHeight = window . screen . height ;
913 let height ;
1014 let setTop ;
1115 let paddingBottom ;
1216 let marginBottom ;
13- let requestFram ;
14- let oldScrollTop ;
15- let scrollEl ;
16- let heightEl ;
17- let scrollType = el . attributes . type . value ;
18- let scrollReduce = 2 ;
19- if ( scrollType == 1 ) {
20- scrollEl = document . body ;
21- heightEl = el ;
22- } else {
23- scrollEl = el ;
24- heightEl = el . children [ 0 ] ;
25- }
17+ let requestFram ;
18+ let oldScrollTop ;
19+ let scrollEl ;
20+ let heightEl ;
21+ let scrollType = el . attributes . type && el . attributes . type . value ;
22+ let scrollReduce = 2 ;
23+ if ( scrollType == 2 ) {
24+ scrollEl = el ;
25+ heightEl = el . children [ 0 ] ;
26+ } else {
27+ scrollEl = document . body ;
28+ heightEl = el ;
29+ }
2630
27- el . addEventListener ( 'touchstart' , ( ) => {
28- height = heightEl . clientHeight ;
29- if ( scrollType == 2 ) {
30- height = height
31- }
32- setTop = el . offsetTop ;
33- paddingBottom = getStyle ( el , 'paddingBottom' ) ;
34- marginBottom = getStyle ( el , 'marginBottom' ) ;
35- } , false )
31+ el . addEventListener ( 'touchstart' , ( ) => {
32+ height = heightEl . clientHeight ;
33+ if ( scrollType == 2 ) {
34+ height = height
35+ }
36+ setTop = el . offsetTop ;
37+ paddingBottom = getStyle ( el , 'paddingBottom' ) ;
38+ marginBottom = getStyle ( el , 'marginBottom' ) ;
39+ } , false )
3640
37- el . addEventListener ( 'touchmove' , ( ) => {
38- loadMore ( ) ;
39- } , false )
41+ el . addEventListener ( 'touchmove' , ( ) => {
42+ loadMore ( ) ;
43+ } , false )
4044
41- el . addEventListener ( 'touchend' , ( ) => {
42- oldScrollTop = scrollEl . scrollTop ;
43- moveEnd ( ) ;
44- } , false )
45-
46- const moveEnd = ( ) => {
47- requestFram = requestAnimationFrame ( ( ) => {
48- if ( scrollEl . scrollTop != oldScrollTop ) {
49- oldScrollTop = scrollEl . scrollTop ;
50- moveEnd ( )
51- } else {
52- cancelAnimationFrame ( requestFram ) ;
53- height = heightEl . clientHeight ;
54- loadMore ( ) ;
55- }
56- } )
57- }
45+ el . addEventListener ( 'touchend' , ( ) => {
46+ oldScrollTop = scrollEl . scrollTop ;
47+ moveEnd ( ) ;
48+ } , false )
5849
59- const loadMore = ( ) => {
60- if ( scrollEl . scrollTop + windowHeight >= height + setTop + paddingBottom + marginBottom - scrollReduce ) {
61- binding . value ( ) ;
62- }
63- }
50+ const moveEnd = ( ) => {
51+ requestFram = requestAnimationFrame ( ( ) => {
52+ if ( scrollEl . scrollTop != oldScrollTop ) {
53+ oldScrollTop = scrollEl . scrollTop ;
54+ moveEnd ( )
55+ } else {
56+ cancelAnimationFrame ( requestFram ) ;
57+ height = heightEl . clientHeight ;
58+ loadMore ( ) ;
59+ }
60+ } )
61+ }
62+
63+ const loadMore = ( ) => {
64+ if ( scrollEl . scrollTop + windowHeight >= height + setTop + paddingBottom + marginBottom - scrollReduce ) {
65+ binding . value ( ) ;
66+ }
67+ }
6468 }
6569 }
6670 }
@@ -69,17 +73,17 @@ export const loadMore = {
6973export const getImgPath = {
7074 methods : {
7175 //传递过来的图片地址需要处理后才能正常使用
72- getImgPath ( path ) {
76+ getImgPath ( path ) {
7377 let suffix ;
74- if ( ! path ) {
78+ if ( ! path ) {
7579 return 'http://test.fe.ptdev.cn/elm/elmlogo.jpeg'
7680 }
7781 if ( path . indexOf ( 'jpeg' ) !== - 1 ) {
7882 suffix = '.jpeg'
79- } else {
83+ } else {
8084 suffix = '.png'
8185 }
82- let url = '/' + path . substr ( 0 , 1 ) + '/' + path . substr ( 1 , 2 ) + '/' + path . substr ( 3 ) + suffix ;
86+ let url = '/' + path . substr ( 0 , 1 ) + '/' + path . substr ( 1 , 2 ) + '/' + path . substr ( 3 ) + suffix ;
8387 return imgBaseUrl + url
8488 } ,
8589 }
0 commit comments