el-dialog滚动顶部

要将 el-dialog 滚动到顶部，你可以使用以下方法：

1. 使用 ref 获取到 el-dialog 的实例。在 el-dialog 上添加 ref 属性，例如 `<el-dialog ref="dialog"></el-dialog>`。

2. 在需要滚动到顶部的时候，调用实例的 `scrollTop` 方法。例如，在某个按钮的点击事件中添加以下代码：

this.$refs.dialog.$refs.bodyWrapper.scrollTop = 0;

这样就会将 el-dialog 滚动到顶部位置。请注意，上述代码中的 `dialog` 是你为 el-dialog 添加的 ref 名称，你可以根据实际情况修改。

相关问题

el-dialog fullscreen滚动顶部

要将 el-dialog 设置为全屏并使其滚动到顶部，您可以按照以下步骤操作：

1. 首先，确保使用了正确的 el-dialog 组件，并设置了合适的高度和宽度。您可以使用以下代码作为参考：

<el-dialog :fullscreen="true" :visible.sync="dialogVisible" width="100%" height="100%">
  <!-- 对话框内容 -->
</el-dialog>

2. 接下来，您需要将对话框的内容包装在一个可滚动的容器中。您可以使用 el-scrollbar 组件来实现这一点。请确保您已经导入了 el-scrollbar 组件。

<el-dialog :fullscreen="true" :visible.sync="dialogVisible" width="100%" height="100%">
  <el-scrollbar wrap-class="dialog-scroll">
    <!-- 对话框内容 -->
  </el-scrollbar>
</el-dialog>

3. 最后，在您的 CSS 样式中，为 dialog-scroll 类设置合适的高度和溢出属性，以使其内容可以滚动到顶部。

.dialog-scroll {
  height: calc(100% - 55px); /* 根据实际情况调整高度 */
  overflow-y: auto;
}

通过以上步骤，您应该能够将 el-dialog 设置为全屏并使其内容可以滚动到顶部。请根据您的实际需求进行调整。

vue3 el-dialog设置表单滚动条到顶部

你可以在打开 `el-dialog` 的时候设置 `scrollTop` 属性为0来将表单滚动条置于顶部，具体代码如下：

// 获取到el-dialog的DOM元素
const dialogEl = document.querySelector('.el-dialog')

// 将表单滚动条置于顶部
dialogEl.scrollTop = 0;

你可以在 `el-dialog` 的 `opened` 事件中调用上面的代码来实现这个功能，具体代码如下：

<template>
  <el-dialog
    title="Dialog Title"
    :visible.sync="dialogVisible"
    @opened="handleDialogOpen"
  >
    <el-form>
      <!-- 表单内容 -->
    </el-form>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
    };
  },
  methods: {
    handleDialogOpen() {
      // 获取到el-dialog的DOM元素
      const dialogEl = document.querySelector('.el-dialog')
      
      // 将表单滚动条置于顶部
      dialogEl.scrollTop = 0;
    },
  },
};
</script>

以上代码可以确保每次打开 `el-dialog` 时都将表单滚动条置于顶部。