vue实现滑动到底部加载更多效果

2023-08-17 01:42:04 74

.content{ .isbottom{ display:flex; align-items:center; justify-content:center; padding:15px0; color:#999; i{ font-size:30px; animation:rotate1sinfinite; } span{ color:#ccc; padding-left:15px; } } .logo{ background:#fff; padding-bottom:15px; div{ &:nth-child(1){ display:flex; justify-content:center; img{ width:60px; height:60px; } } &:nth-child(2){ text-align:center; padding:15px15px; color:#609bf0; } &:nth-child(3){ display:flex; justify-content:center; align-items:center; color:#1296db; border:#1296db1PXsolid; width:50%; margin:0auto; padding:5px0; font-size:15px; img{ width:20px; height:20px; margin-right:8px; } } } } .info{ background:#fff; margin-bottom:10px; padding-bottom:15px; .swipe{ height:300px; background:#eee; position:relative; .jcc{ display:flex; justify-content:center; height:300px; } img{ //width:100%; height:100%; } .index{ position:absolute; background:rgba(243,244,245,.8); padding:5px15px; bottom:10px; right:10px; border-radius:50px; } } } .info1{ background:#fff; position:relative; padding:15px9px0; height:79px; overflow:hidden; p{ line-height:22px; text-indent:2em; letter-spacing:1.2px; } span{ width:75px; text-align:right; position:absolute; bottom:0; right:9px; color:#39c; background:#fff; i{ color:#333; } } } .shopping{ background:#fff; padding-top:15px; h4{ display:flex; align-items:center; justify-content:center; padding-bottom:10px; >img{ width:30px; height:30px; margin-right:10px; } span{ color:#0f589e; font-weight:normal; } } img{ display:block; width:100%; height:2px; } } .listUl{ //display:flex; //flex-wrap:wrap; padding:015px; top:60px; height:calc(100%-100px)!important; background:#fff; overflow:hidden; .itemLIST{ //float:left; width:50%; display:inline-block; padding-top:15px; padding-bottom:15px; &:nth-child(2n){ padding-right:5px; } &:nth-child(2n-1){ padding-left:5px; } img{ //width:100%; height:100%; /*prettier-ignore*/ //border:1PXsolid#eee; } div{ &:first-child{ overflow:hidden; height:160px; display:flex; align-items:center; justify-content:center; } &:last-child{ h3{ font-weight:normal; font-size:16px; margin-top:5px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; } p{ font-size:14px; margin-top:5px; display:flex; align-items:center; justify-content:space-between;//padding:015px; padding-right:10px; span{ display:block; &:first-child{ color:#888; } &:last-child{ color:red; font-size:16px; } } } } } } } }

vue实现滑动到底部加载更多效果

全部商品

{{item.pTitle}}

随机推荐

vue实现滑动到底部加载更多效果

全部商品

{{item.pTitle}}

热门推荐

随机推荐