Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
longren3th
unidocs-zh
提交
5b0115ff
unidocs-zh
项目概览
longren3th
/
unidocs-zh
与 Fork 源项目一致
Fork自
DCloud / unidocs-zh
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
unidocs-zh
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
5b0115ff
编写于
3月 20, 2024
作者:
H
HRK
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
更新示例
上级
3b2839f7
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
101 addition
and
97 deletion
+101
-97
docs/component/uniui/uni-data-select.md
docs/component/uniui/uni-data-select.md
+9
-8
docs/component/uniui/uni-popup.md
docs/component/uniui/uni-popup.md
+3
-1
docs/component/uniui/uni-segmented-control.md
docs/component/uniui/uni-segmented-control.md
+89
-88
未找到文件。
docs/component/uniui/uni-data-select.md
浏览文件 @
5b0115ff
...
...
@@ -88,14 +88,15 @@ export default {
### DataSelect Props
| 属性名 | 类型 | 可选值 | 默认值 | 说明 |
| :-----------: | :-----------: | :----: | :------: | :-----------------------------------------------------------------: |
| value/v-model | String/Number | - | - | 已选择数据的 value 值(当其值为0时不进行初始化赋值) |
| localdata | Array | - | - | 本地渲染数据 |
| clear | Boolean | - | - | 是否可以清空已选项 |
| label | String | | | 左侧标题 |
| placeholder | String | - | 请选择 | 输入框的提示文字 |
| emptyTips | String | - | 暂无数据 | 没有数据时显示的文字 ,本地数据无效 |
| 属性名 | 类型 | 可选值 | 默认值 | 说明 |
| :-----------: | :-----------: | :--------: | :------: | :--------------------------------------------------: |
| value/v-model | String/Number | - | - | 已选择数据的 value 值(当其值为0时不进行初始化赋值) |
| localdata | Array | - | - | 本地渲染数据 |
| clear | Boolean | - | - | 是否可以清空已选项 |
| label | String | | | 左侧标题 |
| placeholder | String | - | 请选择 | 输入框的提示文字 |
| emptyTips | String | - | 暂无数据 | 没有数据时显示的文字 ,本地数据无效 |
| placement | String | bottom,top | bottom | 弹出时位置 |
#### DataCom Props
...
...
docs/component/uniui/uni-popup.md
浏览文件 @
5b0115ff
...
...
@@ -31,7 +31,7 @@
<template>
<view>
<button
@
click=
"open"
>
打开弹窗
</button>
<uni-popup
ref=
"popup"
type=
"bottom"
>
底部弹出 Popup
</uni-popup>
<uni-popup
ref=
"popup"
type=
"bottom"
border-radius=
"10px 10px 0 0"
>
底部弹出 Popup 自定义圆角
</uni-popup>
</view>
</template>
<script>
...
...
@@ -113,6 +113,7 @@ export default {
|is-mask-click
**[1.7.4新增]**
|Boolean|true|蒙版点击是否关闭弹窗|
|mask-background-color
**[1.7.4新增]**
|rgba|rgba(0,0,0,0.4)|蒙版颜色,建议使用 rgba 颜色值|
|background-color|String|'none'|主窗口背景色|
|borderRadius|String|无| 设置圆角(左上、右上、右下和左下) 示例:"10px 10px 10px 10px"|
|safe-area|Boolean|true|是否适配底部安全区|
#### Type Options
...
...
@@ -241,6 +242,7 @@ export default {
|showClose
**[1.8.5新增]**
|Boolean|-|是否显示取消按钮|
|value| String
\N
umber|-|输入框默认值,input模式下生效|
|placeholder|String|-|输入框提示文字,input模式下生效|
|borderRadius|String|-|四周圆角值(左上、右上、右下、左下) 示例:"20px 20px 20px 20px"|
|before-close|Boolean|false | 是否拦截按钮事件,如为true,则不会关闭对话框,关闭需要手动执行 uni-popup 的 close 方法|
#### PopupDialog Events
...
...
docs/component/uniui/uni-segmented-control.md
浏览文件 @
5b0115ff
::: tip 组件名:uni-segmented-control
> 代码块: `uSegmentedControl`
[
点击下载&安装
](
https://ext.dcloud.net.cn/plugin?name=uni-segmented-control
)
:::
用作不同视图的显示
## 介绍
### 基本用法
```
html
<template>
<view>
<uni-segmented-control
:current=
"current"
:values=
"items"
@
clickItem=
"onClickItem"
styleType=
"button"
activeColor=
"#4cd964"
></uni-segmented-control>
<view
class=
"content"
>
<view
v-show=
"current === 0"
>
选项卡1的内容
</view>
<view
v-show=
"current === 1"
>
选项卡2的内容
</view>
<view
v-show=
"current === 2"
>
选项卡3的内容
</view>
</view>
</view>
</template>
<script>
export
default
{
data
()
{
return
{
...
items
:
[
'
选项1
'
,
'
选项2
'
,
'
选项3
'
],
current
:
0
};
},
methods
:
{
...
onClickItem
(
e
)
{
if
(
this
.
current
!=
e
.
currentIndex
)
{
this
.
current
=
e
.
currentIndex
;
}
}
}
};
</script>
```
## API
### SegmentedControl Props
|属性名|类型|默认值|说明|
|:-:|:-:|:-:|:-:|
|current|Number|0|当前选中的tab索引值,从0计数|
|styleType|String|button|分段器样式类型,可选值:button(按钮类型),text(文字类型) |
|activeColor|String|#007aff|选中的标签背景色与边框颜色|
|values|Array|-|选项数组|
### SegmentedControl Events
|事件名|说明|返回值|
|:-:|:-:|:-:|
|@clickItem |组件触发点击事件时触发|e={currentIndex} |
## 示例
::: warning 注意
示例依赖了
`uni-card`
`uni-section`
`uni-scss`
等多个组件,直接拷贝示例代码将无法正常运行 。
请到
[
组件下载页面
](
https://ext.dcloud.net.cn/plugin?name=uni-segmented-control
)
,在页面右侧选择
`使用 HBuilderX导入示例项目`
,体验完整组件示例。
:::
::: preview https://hellouniapp.dcloud.net.cn/pages/extUI/segmented-control/segmented-control
> Template
```
html
::: tip 组件名:uni-segmented-control
> 代码块: `uSegmentedControl`
[
点击下载&安装
](
https://ext.dcloud.net.cn/plugin?name=uni-segmented-control
)
:::
用作不同视图的显示
## 介绍
### 基本用法
```
html
<template>
<view>
<uni-segmented-control
:current=
"current"
:values=
"items"
@
clickItem=
"onClickItem"
styleType=
"button"
activeColor=
"#4cd964"
></uni-segmented-control>
<view
class=
"content"
>
<view
v-show=
"current === 0"
>
选项卡1的内容
</view>
<view
v-show=
"current === 1"
>
选项卡2的内容
</view>
<view
v-show=
"current === 2"
>
选项卡3的内容
</view>
</view>
</view>
</template>
<script>
export
default
{
data
()
{
return
{
...
items
:
[
'
选项1
'
,
'
选项2
'
,
'
选项3
'
],
current
:
0
};
},
methods
:
{
...
onClickItem
(
e
)
{
if
(
this
.
current
!=
e
.
currentIndex
)
{
this
.
current
=
e
.
currentIndex
;
}
}
}
};
</script>
```
## API
### SegmentedControl Props
| 属性名 | 类型 | 默认值 | 说明 |
| :-----------: | :----: | :---------: | :----------------------------------------------------------: |
| current | Number | 0 | 当前选中的tab索引值,从0计数 |
| styleType | String | button | 分段器样式类型,可选值:button(按钮类型),text(文字类型) |
| activeColor | String | #007aff | 选中的标签背景色与边框颜色 |
| inActiveColor | String | transparent | 未激活时的颜色 |
| values | Array | - | 选项数组 |
### SegmentedControl Events
| 事件名 | 说明 | 返回值 |
| :--------: | :--------------------: | :--------------: |
| @clickItem | 组件触发点击事件时触发 | e={currentIndex} |
## 示例
::: warning 注意
示例依赖了
`uni-card`
`uni-section`
`uni-scss`
等多个组件,直接拷贝示例代码将无法正常运行 。
请到
[
组件下载页面
](
https://ext.dcloud.net.cn/plugin?name=uni-segmented-control
)
,在页面右侧选择
`使用 HBuilderX导入示例项目`
,体验完整组件示例。
:::
::: preview https://hellouniapp.dcloud.net.cn/pages/extUI/segmented-control/segmented-control
> Template
```
html
<template>
<view>
<uni-card
is-full
>
...
...
@@ -127,8 +128,8 @@ export default {
</view>
</view>
</template>
```
> Script
```
> Script
```
html
<script>
export
default
{
...
...
@@ -173,9 +174,9 @@ export default {
}
}
</script>
```
> Style
```
> Style
```
html
<style
lang=
"scss"
>
.example-body
{
...
...
@@ -249,8 +250,8 @@ export default {
.uni-list-item__content-title
{
font-size
:
14px
;
}
</style>
```
:::
</style>
```
:::
[
完整示例演示
](
https://hellouniapp.dcloud.net.cn/pages/extUI/segmented-control/segmented-control
)
\ No newline at end of file
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录