Skip to content

Commit 000486c

Browse files
authored
Merge pull request #486 from rulishu/rls
doc(Tabs): 修改Tabs api文档
2 parents 0ef5449 + 1ccc96a commit 000486c

File tree

1 file changed

+25
-55
lines changed

1 file changed

+25
-55
lines changed

packages/core/src/Tabs/README.md

Lines changed: 25 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -66,64 +66,34 @@ export default Demo
6666
```
6767
### Tabs Props
6868

69-
```ts
70-
import { ViewStyle,ViewProps } from 'react-native';
71-
72-
export interface TabsProps extends ViewProps {
73-
/** 子元素 */
74-
children?: JSX.Element | Array<JSX.Element>
75-
/** 容器样式 */
76-
style?: ViewStyle
77-
}
78-
export default Demo
79-
```
80-
69+
继承原生 View 属性 [`ViewProps`](https://reactnative.dev/docs/view)
70+
| 参数 | 说明 | 类型 | 默认值 |
71+
|------|------|-----|------|
72+
| children | 子元素 | JSX.Element | - |
73+
| style | 容器样式 | ViewStyle | - |
8174

8275
### Tabs.Item Props
8376

84-
```ts
85-
import { IconsName } from '@uiw/react-native';
77+
| 参数 | 说明 | 类型 | 默认值 |
78+
|------|------|-----|------|
79+
| title | 显示的文字 | string | - |
80+
| style | 样式集合,具体项见下表 | TabsItemStyle | - |
81+
| onPress | 点击时触发 | (title: string) => void | - |
82+
| icon | 图标 | JSX.Element, React.ReactNode, React.ReactElement, IconsName | - |
83+
| border | 是否显示下边框 | boolean | - |
8684

87-
export type TabsItemIconTypes = IconsName | React.ReactElement | React.ReactNode | JSX.Element
85+
### TabsItemStyle
86+
| 参数 | 说明 | 类型 | 默认值 |
87+
|------|------|-----|------|
88+
| width | 宽度 | number | - |
89+
| titleColor | 文字颜色 | string | - |
90+
| titleFontWeight | 文字粗细 |`'100','200','300','400','500','600','700','800','900','bold','normal' `| - |
91+
| titleSize | 文字大小 | number | - |
92+
| iconColor | icon 颜色 | string | - |
93+
| iconSize | icon 大小 | number | - |
94+
| borderWidth | border 宽度 | number | - |
95+
| borderColor | border 颜色 | string | - |
96+
| borderBottom | border 底部距离 | number | - |
97+
| borderHeight | border 粗细 | number | - |
8898

89-
export interface TabsItemProps {
90-
/** 显示的文字 */
91-
title: string,
92-
/** 样式集合 */
93-
style?: TabsItemStyle,
94-
/**
95-
* 点击时触发
96-
* void
97-
* @param title type: string title 文字
98-
*/
99-
onPress?: (title: string) => void,
100-
/** 图标 */
101-
icon?: TabsItemIconTypes,
102-
/** 是否显示下边框 */
103-
border?: boolean
104-
}
10599

106-
/** 样式集合类型 */
107-
export interface TabsItemStyle {
108-
/** 宽度 */
109-
width?: number,
110-
/** 文字颜色 */
111-
titleColor?: string,
112-
/** 文字粗细 */
113-
titleFontWeight?: '100'|'200'|'300'|'400'|'500'|'600'|'700'|'800'|'900'|'bold'|'normal',
114-
/** 文字大小 */
115-
titleSize?: number,
116-
/** icon 颜色 */
117-
iconColor?: string,
118-
/** icon 大小 */
119-
iconSize?: number,
120-
/** border 宽度 */
121-
borderWidth?: number,
122-
/** border 颜色 */
123-
borderColor?: string,
124-
/** border 距离底部距离一般与 Tabs paddingBottom 相等 */
125-
borderBottom?: number,
126-
/** border 粗细 */
127-
borderHeight?: number
128-
}
129-
```

0 commit comments

Comments
 (0)