twh_eastasia/vue-pure-admin
1
0
Fork 0
mirror of https://github.com/pure-admin/vue-pure-admin.git synced 2025-11-03 13:44:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: reset xPos and yPos in seamlessScroll

Browse Source
This commit is contained in:
xiaoxian521
2021-04-15 19:40:38 +08:00
parent e09ed0fb47
commit f886a38694
2 changed files with 33 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/views/components/seamless-scroll/index.vue
View File

@@ -14,7 +14,6 @@
<ul class="item">
<li v-for="(item, index) in listData" :key="index">
<span class="title" v-text="item.title"></span>
<span class="date" v-text="item.date"></span>
</li>
</ul>
</SeamlessScroll>
@@ -29,65 +28,56 @@ import { templateRef } from "@vueuse/core";
import SeamlessScroll from "/@/components/SeamlessScroll";
export default {
components: {
SeamlessScroll,
SeamlessScroll
},
setup() {
const scroll = templateRef<HTMLElement | null>("scroll", null);
let listData = ref([
{
title: "无缝滚动第一行无缝滚动第一行",
date: "2021-5-1",
title: "无缝滚动第一行无缝滚动第一行！！！！！！！！！！"
},
{
title: "无缝滚动第二行无缝滚动第二行",
date: "2021-5-1",
title: "无缝滚动第二行无缝滚动第二行！！！！！！！！！！"
},
{
title: "无缝滚动第三行无缝滚动第三行",
date: "2021-5-1",
title: "无缝滚动第三行无缝滚动第三行！！！！！！！！！！"
},
{
title: "无缝滚动第四行无缝滚动第四行",
date: "2021-5-1",
title: "无缝滚动第四行无缝滚动第四行！！！！！！！！！！"
},
{
title: "无缝滚动第五行无缝滚动第五行",
date: "2021-5-1",
title: "无缝滚动第五行无缝滚动第五行！！！！！！！！！！"
},
{
title: "无缝滚动第六行无缝滚动第六行",
date: "2021-5-1",
title: "无缝滚动第六行无缝滚动第六行！！！！！！！！！！"
},
{
title: "无缝滚动第七行无缝滚动第七行",
date: "2021-5-1",
title: "无缝滚动第七行无缝滚动第七行！！！！！！！！！！"
},
{
title: "无缝滚动第八行无缝滚动第八行",
date: "2021-5-1",
title: "无缝滚动第八行无缝滚动第八行！！！！！！！！！！"
},
{
title: "无缝滚动第九行无缝滚动第九行",
date: "2021-5-1",
},
title: "无缝滚动第九行无缝滚动第九行！！！！！！！！！！"
}
]);
let classOption = ref({
direction: "top",
direction: "top"
});
function changeDirection(val) {
scroll.value.scrollInitMove();
scroll.value.reset();
classOption.value.direction = val;
}
return {
listData,
classOption,
changeDirection,
changeDirection
};
},
}
};
</script>