scroll to end of browser on new view opened
This commit is contained in:
parent
0a090c9097
commit
bcbfb347d6
1 changed files with 24 additions and 5 deletions
|
@ -1,6 +1,11 @@
|
|||
<template>
|
||||
<div class="browser">
|
||||
<div class="view" v-for="(address, idx) in addresses" :key="address">
|
||||
<div class="browser" ref="root">
|
||||
<div
|
||||
class="view"
|
||||
v-for="(address, idx) in addresses"
|
||||
:key="address"
|
||||
:data-address="address"
|
||||
>
|
||||
<header :class="{ disabled: addresses.length === 1 }">
|
||||
<sl-icon-button
|
||||
class="this-button"
|
||||
|
@ -33,10 +38,19 @@ export default defineComponent({
|
|||
required: true,
|
||||
},
|
||||
},
|
||||
data: () => {
|
||||
return {};
|
||||
watch: {
|
||||
addresses(addresses: string[], prevAddresses: string[]) {
|
||||
const root = this.$refs.root as HTMLDivElement;
|
||||
if (addresses.length > prevAddresses.length) {
|
||||
this.$nextTick().then(() => {
|
||||
root.scrollTo({
|
||||
left: root.scrollWidth,
|
||||
behavior: "smooth",
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
setup(props) {},
|
||||
methods: {
|
||||
visit(idx: number) {
|
||||
this.$router.push({
|
||||
|
@ -57,7 +71,12 @@ export default defineComponent({
|
|||
<style scoped lang="scss">
|
||||
.browser {
|
||||
display: flex;
|
||||
|
||||
min-height: 100%;
|
||||
margin-left: -2rem;
|
||||
margin-right: -2rem;
|
||||
padding: 0 2rem;
|
||||
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue