From 043d598adf60673e003772a483dd8b6d1eedf44b Mon Sep 17 00:00:00 2001 From: NETOOL <10975108+hxlcn@user.noreply.gitee.com> Date: Wed, 22 Jun 2022 00:34:23 +0000 Subject: [PATCH] =?UTF-8?q?update=20docs/component/uniui/uni-notice-bar.md?= =?UTF-8?q?.=20=E3=80=90singlet=E3=80=91=EF=BC=8C=E6=AD=A4=E5=A4=84?= =?UTF-8?q?=E4=B8=BA=E8=AF=AF=E5=86=99=EF=BC=8C=E5=BA=94=E4=B8=BA=E3=80=90?= =?UTF-8?q?single=E3=80=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/component/uniui/uni-notice-bar.md | 184 ++++++++++++------------- 1 file changed, 92 insertions(+), 92 deletions(-) diff --git a/docs/component/uniui/uni-notice-bar.md b/docs/component/uniui/uni-notice-bar.md index baa28bda3..1079de2ff 100644 --- a/docs/component/uniui/uni-notice-bar.md +++ b/docs/component/uniui/uni-notice-bar.md @@ -1,86 +1,86 @@ - -::: tip 组件名：uni-notice-bar -> 代码块： `uNoticeBar` - -[点击下载&安装](https://ext.dcloud.net.cn/plugin?name=uni-notice-bar) -::: - -通告栏组件 。 - -## 介绍 -### 基本用法 -使用 `text` 属性设置通告栏内容 - -使用 `singlet` 属性设置导是否单行显示 -```html - - -``` -### 文字滚动 -使用 `scrollable` 属性设置通文字是否滚动 -```html - -``` -### 显示图标 -使用 `showIcon` 属性设置是否显示图标 -```html - -``` -### 显示关闭按钮 -使用 `showClose` 属性设置是否显示关闭图标 -```html - -``` -### 查看更多 -使用 `showGetMore` 属性设置是否显示右侧查看更多图标 - -使用 `moreText` 属性设置查看更多文本 -```html - -``` - -::: warning 注意 -如果需要异步获取内容后展示需要使用`v-if`进行控制，`` -::: - -## NoticeBar API - -### NoticeBar Props - -|属性名|类型 |默认值|说明| -|:-:|:-:|:-:|:-:| -|speed|Number|100|文字滚动的速度，默认100px/秒| -|text|String|-|显示文字| -|background-color|String|#fffbe8|背景颜色| -|color|String|#de8c17|文字颜色| -|moreColor|String|#999999|查看更多文字的颜色| -|moreText|String|-|设置“查看更多”的文本| -|single|Boolean|false|是否单行| -|scrollable|Boolean|false|是否滚动，为true时，NoticeBar为单行| -|showIcon|Boolean|false |是否显示左侧喇叭图标| -|showClose|Boolean|false|是否显示左侧关闭按钮| -|showGetMore|Boolean|false|是否显示右侧查看更多图标，为true时，NoticeBar为单行| - -### NoticeBar Events - -|事件名称|说明|返回值 | -|:-:|:-:|:-:| -|@click|点击 NoticeBar 触发事件 |-| -|@close|关闭 NoticeBar 触发事件 |-| -|@getmore|点击”查看更多“时触发事件 |-| - - - -## 示例 -::: warning 注意 -示例依赖了 `uni-card` `uni-section` `uni-scss` 等多个组件，直接拷贝示例代码将无法正常运行 。 - -请到 [组件下载页面](https://ext.dcloud.net.cn/plugin?name=uni-notice-bar) ，在页面右侧选择 `使用 HBuilderX导入示例项目` ，体验完整组件示例。 -::: - -::: preview https://hellouniapp.dcloud.net.cn/pages/extUI/notice-bar/notice-bar -> Template -``` html + +::: tip 组件名：uni-notice-bar +> 代码块： `uNoticeBar` + +[点击下载&安装](https://ext.dcloud.net.cn/plugin?name=uni-notice-bar) +::: + +通告栏组件 。 + +## 介绍 +### 基本用法 +使用 `text` 属性设置通告栏内容 + +使用 `single` 属性设置导是否单行显示 +```html + + +``` +### 文字滚动 +使用 `scrollable` 属性设置通文字是否滚动 +```html + +``` +### 显示图标 +使用 `showIcon` 属性设置是否显示图标 +```html + +``` +### 显示关闭按钮 +使用 `showClose` 属性设置是否显示关闭图标 +```html + +``` +### 查看更多 +使用 `showGetMore` 属性设置是否显示右侧查看更多图标 + +使用 `moreText` 属性设置查看更多文本 +```html + +``` + +::: warning 注意 +如果需要异步获取内容后展示需要使用`v-if`进行控制，`` +::: + +## NoticeBar API + +### NoticeBar Props + +|属性名|类型 |默认值|说明| +|:-:|:-:|:-:|:-:| +|speed|Number|100|文字滚动的速度，默认100px/秒| +|text|String|-|显示文字| +|background-color|String|#fffbe8|背景颜色| +|color|String|#de8c17|文字颜色| +|moreColor|String|#999999|查看更多文字的颜色| +|moreText|String|-|设置“查看更多”的文本| +|single|Boolean|false|是否单行| +|scrollable|Boolean|false|是否滚动，为true时，NoticeBar为单行| +|showIcon|Boolean|false |是否显示左侧喇叭图标| +|showClose|Boolean|false|是否显示左侧关闭按钮| +|showGetMore|Boolean|false|是否显示右侧查看更多图标，为true时，NoticeBar为单行| + +### NoticeBar Events + +|事件名称|说明|返回值 | +|:-:|:-:|:-:| +|@click|点击 NoticeBar 触发事件 |-| +|@close|关闭 NoticeBar 触发事件 |-| +|@getmore|点击”查看更多“时触发事件 |-| + + + +## 示例 +::: warning 注意 +示例依赖了 `uni-card` `uni-section` `uni-scss` 等多个组件，直接拷贝示例代码将无法正常运行 。 + +请到 [组件下载页面](https://ext.dcloud.net.cn/plugin?name=uni-notice-bar) ，在页面右侧选择 `使用 HBuilderX导入示例项目` ，体验完整组件示例。 +::: + +::: preview https://hellouniapp.dcloud.net.cn/pages/extUI/notice-bar/notice-bar +> Template +``` html -``` -> Script +``` +> Script ```html -``` -> Style +``` +> Style ```html - -``` -::: - + + +``` +::: + [完整示例演示](https://hellouniapp.dcloud.net.cn/pages/extUI/notice-bar/notice-bar) \ No newline at end of file -- Gitee