javascript/element-plus
1
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2026-03-13 07:51:17 +08:00
Code Issues Packages Projects Releases Wiki Activity

Revert "feat(components): [alert] add open and auto-close functionality with delay (#20533,#22028)" (#22560)

Browse Source 
* Revert "fix(components): [alert] show immediately when `showAfter` not needed (#22028)"

This reverts commit 229a0a159b.

* Revert "feat(components): [alert] add open and auto-close functionality with delays (#20533)"

* chore: update deprecated

* docs: update remark
This commit is contained in:
sea
2025-11-17 11:04:56 +08:00
committed by GitHub
parent 8e5f8b7a86
commit cd2728af99
5 changed files with 44 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
docs/en-US/component/alert.md
View File

@@ -75,38 +75,30 @@ alert/icon-description
:::
## With Delayed Attributes ^(2.10.0)
:::demo At last, this is an example with delayed attributes.
alert/delayed
:::
## Alert API
### Attributes
| Name | Description | Type | Default |
| -------------------- | ---------------------------------------- | -------------------------------------------------------------------------- | ------- |
| title | alert title. | ^[string] | — |
| type | alert type. | ^[enum]`'primary' (2.9.11) \| 'success' \| 'warning' \| 'info' \| 'error'` | info |
| description | descriptive text. | ^[string] | — |
| closable | whether alert can be dismissed. | ^[boolean] | true |
| center | whether content is placed in the center. | ^[boolean] | false |
| close-text | customized close button text. | ^[string] | — |
| show-icon | whether a type icon is displayed. | ^[boolean] | false |
| effect | theme style. | ^[enum]`'light' \| 'dark'` | light |
| show-after ^(2.10.0) | delay of appearance, in millisecond | ^[number] | 0 |
| hide-after ^(2.10.0) | delay of disappear, in millisecond | ^[number] | 200 |
| auto-close ^(2.10.0) | timeout in milliseconds to hide alert | ^[number] | 0 |
| Name | Description | Type | Default |
| ---------------------------------- | ---------------------------------------- | --------------------------------------------------------------------------- | ------- |
| title | alert title. | ^[string] | — |
| type | alert type. | ^[enum]`'primary' (2.9.11) \| 'success' \| 'warning' \| 'info' \| 'error' ` | info |
| description | descriptive text. | ^[string] | — |
| closable | whether alert can be dismissed. | ^[boolean] | true |
| center | whether content is placed in the center. | ^[boolean] | false |
| close-text | customized close button text. | ^[string] | — |
| show-icon | whether a type icon is displayed. | ^[boolean] | false |
| effect | theme style. | ^[enum]`'light' \| 'dark'` | light |
| show-after ^(2.10.0) ^(deprecated) | delay of appearance, in millisecond | ^[number] | 0 |
| hide-after ^(2.10.0) ^(deprecated) | delay of disappear, in millisecond | ^[number] | 200 |
| auto-close ^(2.10.0) ^(deprecated) | timeout in milliseconds to hide alert | ^[number] | 0 |
### Events
| Name | Description | Type |
| -------------- | ----------------------------- | ------------------------------------ |
| open ^(2.10.0) | trigger when alert is opened. | ^[Function]`() => void` |
| close | trigger when alert is closed. | ^[Function]`(event?: Event) => void` |
| Name | Description | Type |
| --------------------------- | ----------------------------- | ---------------------------------------- |
| close | trigger when alert is closed. | ^[Function]`(event: MouseEvent) => void` |
| open ^(2.10.0)^(deprecated) | trigger when alert is opened. | ^[Function]`() => void` |
### Slots

32
docs/examples/alert/delayed.vue
View File

@@ -1,32 +0,0 @@
<template>
<div style="max-width: 600px">
<el-alert
title="Primary alert that appearance after 5000 milliseconds"
type="primary"
:show-after="5000"
@open="console.log('open')"
/>
<el-alert
title="Success alert that disappear after 5000 milliseconds"
type="success"
:hide-after="5000"
/>
<el-alert
title="Info alert that in 5000 milliseconds to be hidden"
type="info"
:closable="false"
:auto-close="5000"
/>
</div>
</template>
<script setup lang="ts"></script>
<style scoped>
.el-alert {
margin: 20px 0 0;
}
.el-alert:first-child {
margin: 0;
}
</style>