vue alert显示html,vue组件之Alert详解

本文主要介绍了vue组件之Alert的实现代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧，希望能帮助到大家。

前言

本文主要Alert 组件的大致框架， 提供少量可配置选项。 旨在大致提供思路

Alert

用于页面中展示重要的提示信息。

templat模板结构



大致结构 alert框，icon图标， slot插值 (其他样式颜色选项...)

如果需要动画 可以在外层包上Vue内置组件transition

script

name: 组件的名字

props: 属性

methods: 方法

点击关闭 向外暴露2个事件

使用

这是一个不能关闭的alert

这是一个可以关闭的alert

Attribute参数说明类型可选值默认值closable是否可关闭boolean—true

show是否显示boolean—true

Event事件名称说明回调参数update:show关闭时触发，是否显示falsefalse

close关闭时触发—

相关推荐：

JavaScript中alert()使用的注意事项

js中除了alert，还有哪些其他提示方法

javascript中alert()与console.log()的区别