chore: prepare notice bar component refactoring
This commit is contained in:
@@ -1,129 +0,0 @@
|
||||
::: anchor
|
||||
:::
|
||||
|
||||
::: title 基本介绍
|
||||
:::
|
||||
|
||||
::: describe 全局展示操作反馈信息。
|
||||
:::
|
||||
|
||||
::: title 基础使用
|
||||
:::
|
||||
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
<lay-notice-bar text="以写作为工具,为道途,先帮助自己一程,再以自己的领悟帮助他人一程, 这是一种服务 。" mode="link"></lay-notice-bar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { layer } from "@layui/layer-vue"
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
return {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
:::
|
||||
|
||||
::: title 使用图标
|
||||
:::
|
||||
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
<lay-notice-bar leftIcon="layui-icon-mute" text="最好的爱是两个人彼此做个伴,不要束缚,不要缠绕,不要占有,不渴望从对方那里得到,只是并肩站在一起,看看这个世界。"></lay-notice-bar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref } from "vue"
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
return {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
:::
|
||||
|
||||
::: title 允许关闭
|
||||
:::
|
||||
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
<lay-notice-bar leftIcon="layui-icon-mute" rightIcon="layui-icon-close" text="所有发生过的都是既定的。是应该发生。只能发生。" mode="closeable"></lay-notice-bar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref } from "vue"
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
const visible = ref(true);
|
||||
|
||||
return {
|
||||
visible
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
:::
|
||||
|
||||
::: 垂直滚动
|
||||
:::
|
||||
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
<lay-notice-bar :scrollable="true" leftIcon="layui-icon-mute" :textlist="list"></lay-notice-bar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref,reactive } from "vue"
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
const list = reactive([
|
||||
'通知一:users !',
|
||||
'通知二:world !',
|
||||
'通知三:friend !',
|
||||
'通知四:ok!',
|
||||
])
|
||||
|
||||
return {
|
||||
list
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
:::
|
||||
|
||||
::: title Notice Bar 属性
|
||||
:::
|
||||
|
||||
::: table
|
||||
|
||||
| 事件 | 描述 | 参数 |
|
||||
| ---- | -------- | --------------------- |
|
||||
| mode | 模式 | 'link' 'closeable' |
|
||||
| text | 内容 | 滚动内容 |
|
||||
| leftIcon | 左侧图标 | -- |
|
||||
| rightIcon | 右侧图标 | -- |
|
||||
| scrollable | 是否开启垂直滚动|true,false|
|
||||
| textlist | 垂直滚动内容| Array|
|
||||
:::
|
||||
|
||||
::: previousNext transfer
|
||||
:::
|
||||
@@ -371,12 +371,6 @@ const zhCN = [
|
||||
component: () => import("../document/zh-CN/components/scroll.md"),
|
||||
meta: { title: "虚拟滚动" },
|
||||
},
|
||||
{
|
||||
path: "/zh-CN/components/noticeBar",
|
||||
component: () =>
|
||||
import("../document/zh-CN/components/noticeBar.md"),
|
||||
meta: { title: "通知栏" },
|
||||
},
|
||||
{
|
||||
path: "/zh-CN/components/transition",
|
||||
component: () =>
|
||||
|
||||
@@ -41,7 +41,7 @@ const menus = [
|
||||
},
|
||||
{
|
||||
id: 103,
|
||||
title: "水波纹",
|
||||
title: "波纹",
|
||||
subTitle: "ripple",
|
||||
path: "/zh-CN/components/ripple",
|
||||
},
|
||||
@@ -350,13 +350,7 @@ const menus = [
|
||||
title: "虚拟滚动",
|
||||
subTitle: "scroll",
|
||||
path: "/zh-CN/components/scroll",
|
||||
},
|
||||
{
|
||||
id: 100,
|
||||
title: "通知栏",
|
||||
subTitle: "noticeBar",
|
||||
path: "/zh-CN/components/noticeBar",
|
||||
},
|
||||
}
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user