Javascript 用于视差的Vue插件或组件 背景

考虑以下组成部分

<template>

    <div>
        <slot></slot>
    </div>

</template>

<script>

    export default {

        created () {

            // Register the scroll event
            window.addEventListener('scroll', this.handleScroll);

        },

        methods: {

            /**
             * Handle the window scroll event.
             *
             * @return void
             */
            handleScroll () {
                // Do something...
            }
        }
    }

</script>

导出默认值{
创建（）{
//注册滚动事件
window.addEventListener（'scroll'，this.handleScroll）；
},
方法：{
/**
*处理窗口滚动事件。
*
*@返回无效
*/
handleScroll（）{
//做点什么。。。
}
}
}

使用上面的示例，非常简单，如果我在一个页面上多次使用该组件，它将为scroll事件注册多个事件侦听器（每个组件使用一个），这可能是低效的

这让我想到也许Vue插件更合适，因为我相信我可以注册一个事件监听器，它可以循环执行指令/组件的每次出现，并应用任何必要的更改

然而，我对使用插件有一些保留意见，因此，我想在这里发布这些信息，希望有人能为我提供更多信息，帮助我决定是使用组件还是插件

以下是我对使用插件的保留意见：

• 我对它们不熟悉，即必须了解它们的工作原理
• 它们实际上是否更有效，即它是否能够克服注册多个事件侦听器的问题
• 插件的好处是否值得（一般而言）

我打算使用插件的方式如下，即自定义指令：

<div v-parallax="0.2"></div>

它可能不相关，但通过应用此指令，元素将被添加到

项

数组中，并且如果元素位于视口中，则每个项的

背景位置将随着用户滚动/调整大小而更新

我的问题
基于以上所有信息，您是否会为该特定功能推荐Vue插件或Vue组件

注意-我知道Vue的视差插件已经存在，但a）它们不能以我需要的方式工作，b）我只希望为我的特定用例编码，即没有冗余代码