2023年6月20日发(作者:)
动态使⽤scroll-into-view设置滚动条的滚动到指定位置HTML部分:封装的组件 {{}} 组件js组件样式css引⽤组件js部分import tar from '@/components/swiper-tar/swiper-tar'components: { tar},data部分:scroll_into_view:'',tab_list:[{name:'全部',id:'id0'},{name:'待付款',id:'id1'},{name:'待确认',id:'id2'},{name:'待发货',id:'id3'},{name:'待收货',id:'id4'},{name:'已完成',id:'id5'},{name:'已取消',id:'id6'},{name:'⽆效',id:'id7'},// '全部',],onLoad注意要使⽤this.$nextTick 来对 scroll_into_view 值的改动tTab = tTab ;this.$nextTick(()=> {_into_view = 'id' + ng()('打印导航栏滚动条滚动到的⼦模块id');(_into_view);});_into_view = '' ;mmethoethod注意要使⽤this.$nextTick 来对 scroll_into_view 值的改动// 轮播模块切换swiper_change:function(e) {tTab = t;("t");(t);this.$nextTick(()=> {_into_view = 'id' + ng()('打印导航栏滚动条滚动到的⼦模块id');(_into_view);});_into_view = '' ;},tarClick:function(index) {('触发点击切换事件')(index)tTab = index ;this.$nextTick(()=> {_into_view = 'id' + ng()('打印导航栏滚动条滚动到的⼦模块id');(_into_view);});_into_view = '' ;},效果 |
2023年6月20日发(作者:)
动态使⽤scroll-into-view设置滚动条的滚动到指定位置HTML部分:封装的组件 {{}} 组件js组件样式css引⽤组件js部分import tar from '@/components/swiper-tar/swiper-tar'components: { tar},data部分:scroll_into_view:'',tab_list:[{name:'全部',id:'id0'},{name:'待付款',id:'id1'},{name:'待确认',id:'id2'},{name:'待发货',id:'id3'},{name:'待收货',id:'id4'},{name:'已完成',id:'id5'},{name:'已取消',id:'id6'},{name:'⽆效',id:'id7'},// '全部',],onLoad注意要使⽤this.$nextTick 来对 scroll_into_view 值的改动tTab = tTab ;this.$nextTick(()=> {_into_view = 'id' + ng()('打印导航栏滚动条滚动到的⼦模块id');(_into_view);});_into_view = '' ;mmethoethod注意要使⽤this.$nextTick 来对 scroll_into_view 值的改动// 轮播模块切换swiper_change:function(e) {tTab = t;("t");(t);this.$nextTick(()=> {_into_view = 'id' + ng()('打印导航栏滚动条滚动到的⼦模块id');(_into_view);});_into_view = '' ;},tarClick:function(index) {('触发点击切换事件')(index)tTab = index ;this.$nextTick(()=> {_into_view = 'id' + ng()('打印导航栏滚动条滚动到的⼦模块id');(_into_view);});_into_view = '' ;},效果 |
发布评论