时间戳

首页 > 解决方案 > vue-next-level-scroll 强制它在 DOM 渲染后单击。Vuejs

vue.js - vue-next-level-scroll 强制它在 DOM 渲染后单击。Vuejs

问题描述

我正在使用来自 https://www.npmjs.com/package/vue-next-level-scroll的这个 vue-next-level-scroll 。

我希望在渲染组件后立即触发此操作。

在我的 vue 文件中，我有以下代码

<vue-next-level-scroll ref="myBtn" :target='`#${this.postIdQuery}`'>
   <button @click='iGotCliked()'>Click me!</button>
</vue-next-level-scroll>

在我的 vue 文件脚本标签中，我有以下更新的函数来获取按钮的 ref 并强制它点击。

updated: function () {
    if (this.postIdQuery != null) {
      const elem = this.$refs.myBtn
      elem.click()
    }
  }

在 dom 中，已经设置了目标的 id。当我点击“点击我！”时，此代码有效 按钮。但是，我希望 vue 单击渲染，以便当用户输入该组件/页面时它会自动滚动到所需的元素。我在这里做错了什么？

标签： vue.js

解决方案

您可以将 updated() 生命周期挂钩更改为mounted()。然后尝试它应该工作。

推荐阅读