我如何设置我的报告按钮，使其在最近一次单击预算按钮加载所有数据后显示？我有一个按钮，一旦点击获得预算，并显示在一个网格在Vue使用剑道网格。为了更快地加载数据，它将在调用另一个API为网格获取另外两列数据之前使用初始数据加载网格。这些第二轮调用可能需要一段时间，因此在for循环中，它们被设置为一次执行10次。数据加载完成后，显示此按钮的最简单方法是什么？
我发布了我当前的方法来获取我的预算和计算结果，我正在设置报告按钮，以在为真时显示。我目前面临的一些问题是多次点击获取预算按钮，即使我在getBudgets方法的开始将estimateAmounts对象数组设置为空，上一次调用的循环可能仍然在迭代，并且仍然可以添加到estimateAmounts中，使其无法在计算中==数据对象。有什么想法或方向是最好的方式去与这一个？请让我知道如果你有任何问题或需要任何更多的信息。

data() {
                return {
                    budgets: [],
                    estimateAmounts: {},
                }
           },
methods: {
    async getBudgets() {

                this.isLoading = true;
                this.budgets = []
                this.estimateAmounts = {}
                const data = await api.budget.getBudgetReport({ 
                  accountIds: this.accountIds.map(a => a.accountId),
                  salesRepIds: this.selectedSalesReps.map(sr => sr.userId),
                  startDate: this.startDate, 
                  endDate: this.endDate 
                })
                this.budgets = data.map(d => { return { ...d, startDate: new Date(d.startDate) } })
                this.isLoading = false;

                // group calculations in 10's to run concurrently and return results faster
                let idSets = chunk(data.map(d => d.budgetId), 10)
                for (const ids of idSets)
                    api.budget.calculateTotalsForBudgets(ids, this.user.userId)
                        .then(res => this.estimateAmounts = { ...this.estimateAmounts, ...res })
            },
    },

    computed: {
        setButtons() {
                        return Object.keys(this.estimateAmounts).length == this.budgets.length && this.budgets.length > 0
                    },
    }