element比较耗时的方法怎么加loading弹窗

可以使用异步编程的方式来解决element比较耗时的方法加loading弹窗的问题。具体实现方式是在方法执行前显示loading弹窗，然后使用异步编程的方式执行方法，方法执行完毕后关闭loading弹窗。以下是一个示例代码：

<template>
  <div>
    <el-button @click="handleClick">执行耗时方法</el-button>
    <el-dialog :visible.sync="loadingVisible">
      <el-progress type="circle" :percentage="loadingPercentage"></el-progress>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      loadingVisible: false,
      loadingPercentage: 0
    }
  },
  methods: {
    async handleClick() {
      this.loadingVisible = true
      this.loadingPercentage = 0
      const result = await this.longTimeMethod()
      this.loadingVisible = false
      console.log(result)
    },
    longTimeMethod() {
      return new Promise(resolve => {
        setTimeout(() => {
          resolve('long time method result')
        }, 5000)
      })
    }
  }
}
</script>

在上面的代码中，我们使用了一个loadingVisible变量来控制loading弹窗的显示和隐藏，使用了一个loadingPercentage变量来控制loading进度条的进度。在handleClick方法中，我们首先将loadingVisible设置为true，然后使用异步编程的方式执行longTimeMethod方法，方法执行完毕后将loadingVisible设置为false。在longTimeMethod方法中，我们使用了Promise来模拟一个耗时的方法，方法执行完毕后返回一个结果。在实际应用中，我们可以将longTimeMethod替换为我们需要执行的耗时方法。