用vue写一个全局消息提示框组件
```javascript
// Message.vue
<template>
<div class="message-container" v-if="show">
<div class="message-box">{{ message }}</div>
</div>
</template>
<script>
export default {
data() {
return {
show: false, // 是否显示消息框
message: '' // 消息内容
}
},
methods: {
showMessage(text) { // 显示新的消息,传入文本参数,并添加到页面中去。
this.show = true; // 将show设置为true,使元素可见。
this.message = text; // 将传入的文本保存到message中。 setTimeout(() => { // 设定一个定时器,2s之后将show设为false,从而隐藏该元素。 this.show = false; }, 2000); } } }; </script> <style scoped></style> ```
AI智能问答网免责声明:
以上内容除特别注明外均来源于网友提问、ChatGPT回答,权益归原著者所有,本站仅作效果演示和欣赏之用;
若以上展示有冒犯或侵害到您,敬请联系我们进行删除处理,谢谢!