Not Updating with inner components

[Neptuniam]

I am using the vue-custom-scrollbar component in a vue project of mine and have encountered an issue. If I use the scrollbar to scroll down and the content inside the component changes and the scrollbar is no longer needed it doesn't update until the user scrolls manually. Is there a way to trigger an update to make it realize the scrollbar isn't needed so I can see the remaining content again?

[Neptuniam]

I tried to make a change to the scroll bars settings to force an update and that works but causes the scroll bar to behave improperly so that isn't really a fix

[zecar]

i'm using a self made directive

Vue.directive('perfect-scroll', {
    bind(el, binding){
        var options = {}
        if(binding.value)
            options = binding.value

        el.dataset.perfectScroll = uniqid()
        // console.log('bind', el)
        // otherwise will put the scrollbar on the left instead of right
        setTimeout(() => perfectScrollbars[el.dataset.perfectScroll] = new PerfectScrollbar(el, options), 0)
    },
    componentUpdated(el){
        // console.log('componentUpdated', el)
        if(_.has(el.dataset, 'perfectScroll') && perfectScrollbars[el.dataset.perfectScroll])
            return perfectScrollbars[el.dataset.perfectScroll].update()
    },
    unbind(el){
        // console.log('unbind', el)
        if(_.has(el.dataset, 'perfectScroll') && perfectScrollbars[el.dataset.perfectScroll]){
            perfectScrollbars[el.dataset.perfectScroll].destroy()
            perfectScrollbars[el.dataset.perfectScroll] = null
            delete perfectScrollbars[el.dataset.perfectScroll]
            delete el.dataset.perfectScroll
        }
    }
})

<div class="messages" v-perfect-scroll="{ suppressScrollX: true }" ref="messagesList" v-on:ps-scroll-y="messagesScrolled">
    <div class="holder">
        // .... childs
    </div>
</div>