首页 > 解决方案 > VueJs - 保存记录时需要带线性进度条

问题描述

单击保存按钮时,我需要显示线性进度条。进度条需要在每个时间间隔更新,完成后需要隐藏。

添加了 vue 组件

<template>
<div class="components" :key="documentComponentkey">
    <!--Document Version History Component-->
    <DocumentHistoryComponents></DocumentHistoryComponents>
    <!--Generic Header Component-->
    <HeaderComponents></HeaderComponents>
    <div class="components-sub-container">           
        <!--Generic Form Component-->
        <BodyComponents></BodyComponents>
    </div>
    <!--Generic Footer Component-->
    <FooterComponents></FooterComponents>
</div>

图片

标签: vue.jsprogress-barvuetify.js

解决方案


<v-progress-linear v-if=true indeterminate></v-progress-linear>

尝试在片段中更改道具不确定。进度条显示取决于 V-if 评估。如果您的 v-if 结果为真,则将显示进度条并持续显示进度动画。如果 v-if 结果为 false,您将看不到进度条。所以在保存完成时设置 v-if (如果你已经设置了这种方式,可能是一旦你从后端收到信号)。


推荐阅读