Vue child component pull-up scroll, how to make the parent component scroll along with the pull-up?

there are multiple child components in the parent component, how to make the whole parent component scroll up when one of the child components scrolls? Need to do a sub-component suction top effect? 

<template>
    <div class="" id="home" >
        <mt-header fixed title="">
        </mt-header>
        <div class="mui-scroll-wrapper" >
            <div class="mui-scroll">
                <mt-swipe :auto="4000" @change="handleChange" style="height: 143px;margin-top: 40px;">
                <mt-swipe-item v-for="str in listImg">
                    <a class="link"  @tap="imgPage(str)">
                        <img :src="str.picUrl" style="width: 100%">
                    </a>
                </mt-swipe-item>
                </mt-swipe>
                <collect v-show="$store.state.opinionData.tapLogo">
                </collect>
                <div style="height: 6px;background-color: -sharpefefef;">
                </div>
                <broadcast v-show="$store.state.opinionData.tapLogo" ref="broadcast" style="height: 50px;">
                </broadcast>
                <div style="height: 6px;background-color: -sharpefefef;">
                </div>
                <tabScroll ></tabScroll> ===
            </div>
        </div>
    </div>
</template>```


QQuc
Vue.js
Apr.07,2021

correct first, the QQ one is not scrolled by Synchronize.
you can stroke up slowly. It should be that after the list page scrolls up a certain distance, it triggers an event to make the top slide up (the animation zooms out)

so you can use a similar method, when the scroll is a certain distance, use the event to tell the parent component to slide up (zoom out / hide)
similarly slide down to show the parent component.

if you want Synchronize to go up and down. It is not recommended that a small piece of the parent component is cut off, so QQ's solution is actually good, with a total of two sizes at the top, and you can change the animation.
if Synchronize slides, listening for scrolling events and then manipulating the parent component also triggers this event should achieve this effect

Has

been implemented? Now I also want to do the effect of a child component scrolling up and the parent component scrolling together. My problem now is that when the child component is nested into the parent component, the embarrassment is that the child component scrolls and the parent component does not move. You need to set the height of the parent component to exceed the content height of the parent component plus the child component to scroll together. Nesting is the operation of clicking and switching subcomponents, but the height of each subcomponent is different, so it is impossible to set a fixed height

.

Previous: Why does the request lose the packet, and how to verify whether the packet is lost?

Next: On the Corialization principle of JS function

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1ea80b3-1ea1.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1ea80b3-1ea1.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?