vuetifyjs/vuetify

[Feature Request] Add duration Prop to Automatically Dismiss v-alert

Open

#20,409 创建于 2024年9月1日

在 GitHub 查看
 (2 评论) (5 反应) (0 负责人)TypeScript (7,139 fork)batch import
T: enhancementT: featuregood first issue

仓库指标

Star
 (40,995 star)
PR 合并指标
 (平均合并 59天 10小时) (30 天内合并 8 个 PR)

描述

Problem to solve

Currently, v-alert components remain visible until manually dismissed, requiring developers to implement a setTimeout() to hide the alert after a certain period. This can lead to repetitive code.

Proposed solution

Introduce a duration prop to the v-alert component. This prop accepts a number representing the duration (in milliseconds) for which the alert should remain visible before automatically closing usage example :

<v-alert :duration="5000" text=" This alert will automatically close after 5 seconds."/>

贡献者指南

研究方向
实现应为 VAlert 组件添加一个 `duration` 属性。查看 VAlert 源文件（可能是 packages/vuetify/src/components/VAlert/VAlert.ts）以了解现有的属性和模式。自动关闭行为应使用 setTimeout，并在持续时间到期后触发一个类似 close 的事件。确保在组件卸载或属性更改时清除计时器。在相应的 spec 文件中编写单元测试。
技术栈
vuetypescript
领域
frontend
议题类型
功能
难度面向新贡献者的预计实现难度，1 表示很小改动，5 表示专家级工作。
1
预计时间有经验贡献者完成调查、实现、测试并准备 pull request 的粗略时间范围。
1 小时以内
活动状态议题当前的可参与程度：新鲜、活跃、陈旧、阻塞或等待维护者输入。
活跃
清晰度议题是否清楚说明期望改动、验收标准和下一步。
清晰
前置要求
VueTypeScriptGit
新手友好度1-100 的估计分数，表示该议题对首次贡献者的友好程度。
75