naive-ui/demo/documentation/components/alert/enUS/closable.md

42 lines
818 B
Markdown
Raw Normal View History

2019-12-09 19:16:03 +08:00
# Closable
```html
2020-02-04 12:55:07 +08:00
<n-alert title="Default Text" type="default" closable>
2019-12-09 19:16:03 +08:00
<template v-slot:icon>
<n-icon>
<ios-airplane />
</n-icon>
</template>
Gee it's good to be back home
</n-alert>
<n-alert title="Info Text" type="info" closable>
Gee it's good to be back home
</n-alert>
<n-alert title="Success Text" type="success" closable>
Leave it till tomorrow to unpack my case
</n-alert>
<n-alert title="Warning Text" type="warning" closable>
Honey disconnect the phone
</n-alert>
2019-12-09 19:18:24 +08:00
<n-alert title="Error Text" type="error" closable>
2019-12-09 19:16:03 +08:00
I'm back in the U.S.S.R.
</n-alert>
```
```js
import iosAirplane from 'naive-ui/lib/icons/ios-airplane'
export default {
components: {
iosAirplane
},
data () {
return {
show: true
}
}
}
```
```css
.n-alert {
margin-bottom: 12px;
}
```