全部产品
云市场
云游戏

Notice 通知

更新时间:2020-08-07 20:34:14

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

  • Kylin 工程中使用该组件。
  • 在其他工程中使用,通过 ESModule 的方式导入组件。

API 文档 提供了 props、slots、events 的接口信息。

Kylin

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

ESModule

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

API 文档

props

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

slots

name 说明 scope
- 公告内容 -

events

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

Demo

基础样式

截图

代码

  1. <template>
  2. <div>
  3. <Notice>
  4. 因全国公民身份系统升级,添加银行卡
  5. </Notice>
  6. <Notice operation="go" href="https://www.alipay.com/">
  7. 因全国公民身份系统升级,添加银行卡
  8. </Notice>
  9. <Notice operation="close" @close="show = false" v-if="show">
  10. 因全国公民身份系统升级,添加银行卡
  11. </Notice>
  12. </div>
  13. </template>
  14. <script>
  15. export default {
  16. data() {
  17. return {
  18. show: true,
  19. };
  20. },
  21. };
  22. </script>