// console.log(11,miaScroll.clientHeight,miaScroll.scrollHeight); }, //页面滚动 onscroll(){ this.top =this.$refs.miaScroll.scrollTop *this.rate;//计算滚动条所在的高度 }, // onmousedown(){ this.drag=true; this.moveTop =null; }, onmouseup(){ this.drag=false; }, onmousemove(e){ ...
**/export default{name:"HdScroll",props:{showBar:{type:Boolean,default:false}},data(){return{box:undefined,// 自定义滚动条盒子bar:undefined,// 滚动条barHeight:50,// 滚动条高度ratio:1,// 滚动条偏移率force:false,// 滚动条是否被鼠标光标按住hover:false,// 鼠标光标是否悬停在盒子上show:fals...
'height:250px;':(storeidlist.length===0?'height:46px':'height:'+(storeidlist.length*34+12)+'px;')"><el-scrollbarstyle="height:100%;max-height:250px;"ref="myscroll"class="myscroll"><liv-for="store in storeidlist":class="store.storeId === SelectValue.storeId ?'selected ':''"...
{type:Number,required:false,default:300},// 滚动速度,值越大滚动越快step:{type:Number,required:false,default:30}},methods:{scroll(flag){// 获取当前滚动条的位置lett=this.$refs.container.scrollTop// 根据父组件传递过来的step,更新滚动条位置this.$refs.container.scrollTop=flag=="up"?t-this....
② 保留scrolltop的位置 注:第②点是依赖第①点来实现的 一、使用keep-alive增加缓存 我没在App.vue里面写keep-alive,因为系统的入口在main.vue,下面时main.vue中的内容 注意:下面代码中的css,.main-container 中设置的高度很关键 <template> <template v-if="isRouterAlive"> <keep...
vue-infinite-loading - VueJS的无限滚动插件 vue-virtual-scroller - 带任意数目数据的顺畅的滚动 vue-infinite-scroll - VueJS的无限滚动指令 vue-scrollbar - ... 滚轮测量仪上淘宝!优享品质,惊喜价格! 滚轮测量仪,<淘宝>诚信商家,高人气热卖商品,淘你满意!支付无忧,交易更放心!<淘宝>放心挑好货,购物更省心...
.mia-scroll-bar{ position: absolute; top: 0; right: 0; width: 5px; border-radius: 10px; background:#8ec9f7; &:hover{ background:#5ab2f9; } &:active{ background:#259af7; } } } } 2.调用滚动组件页: 1 2 3 4 5 6
1.组件:miaScroll.vue <template> <slot></slot> <div class="mia-scroll-bar-box" v-if="rate<1"> </template> export default { data (){ return { boxToTop:'',thumb:0,maxToTop:'',moveTop:null,top:0,rate:1,drag:false,up:'',down:''};},computed:{ thumbH(){ return...