Notice 通知

Notice 通知文档介绍了使用该组件的不同方式以及 API 文档：

• 在 Kylin 工程中使用该组件。
• 在其他工程中使用，通过 ESModule 的方式导入组件。
• API 文档 提供了 props、slots、events 的接口信息。

Kylin

   

    
<dependency component="{ Notice }" src="@alipay/antui-vue" ></dependency>
   

ESModule

   

    
import { Notice } from '@alipay/antui-vue';
   

API 文档

props

属性	说明	类型	默认值
operation	公告的可用操作，可选go,close	string	null
href	operation为go时有效，点击后跳转位置	string	null

slots

name	说明	scope
-	公告内容	-

events

name	说明	函数
close	operation为close时点击关闭按钮触发	Function(): void

Demo

基础样式

截图

代码

   

    
<template>
    
<div>
    
  <Notice>
    
    因全国公民身份系统升级，添加银行卡银行卡
    
  </Notice>
    
  <Notice operation="go" href="https://www.alipay.com/">
    
    因全国公民身份系统升级，添加银行卡
    
  </Notice>
    
  <Notice operation="close" @close="show = false" v-if="show">
    
    因全国公民身份系统升级，添加银行卡
    
  </Notice>
    
</div>
    

    
</template>
    

    
<script>
    
export default {
    
  data() {
    
    return {
    
      show: true,
    
    };
    
  },
    
};
    
</script>