Skip to content

Commit 480e769

Browse files
author
shenzhiqing
committed
Merge branch 'dev' of github.com:star-hamster/react-native-uiw into dev
2 parents 5fa2c18 + 9ae9903 commit 480e769

File tree

16 files changed

+20696
-407
lines changed

16 files changed

+20696
-407
lines changed

‎packages/core/src/ActionSheet/README.md‎

Lines changed: 9 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -54,33 +54,26 @@ export default Demo
5454

5555
### Props
5656

57-
```js
58-
import { StyleProp, ViewStyle } from 'react-native';
59-
import { ModalProps } from '@uiw/react-native';
60-
61-
export interface DividerStyle {
62-
itemDivider?: StyleProp<ViewStyle>,
63-
actionDivider?: StyleProp<ViewStyle>,
64-
}
65-
```
66-
6757
| 参数 | 说明 | 类型 | 默认值 |
6858
|------|------|-----|------|
6959
| onCancel | 点击蒙层是否关闭 | Boolean | `false` |
70-
| dividerStyle | 分割线样式 | DividerStyle | - |
71-
| containerStyle | 取消的容器样式 | StyleProp<ViewStyle> | - |
60+
| dividerStyle | 分割线样式 | DividerStyleProps | - |
61+
| containerStyle | 取消的容器样式 | StyleProp<`ViewStyle`> | - |
7262
| activeOpacity | 动作在被触摸操作激活时以多少不透明度显示 | number | `#f1f1f1` |
7363
| underlayColor | 动作有触摸操作时显示出来的底层的颜色 | string | `#f1f1f1` |
7464
| cancelText | 取消的文本 | `React.ReactNode` | - |
7565
| textStyle | 取消的文本样式 | `StyleProp<TextStyle>` | - |
7666

77-
### ActionSheetItem Props
78-
```js
79-
import { TextStyle, StyleProp, ViewStyle } from 'react-native';
80-
```
67+
### DividerStyleProps
68+
| 参数 | 说明 | 类型 | 默认值 |
69+
|------|------|-----|------|
70+
| itemDivider | - | StyleProp<`ViewStyle`> | `false` |
71+
| actionDivider | - | StyleProp<`ViewStyle`> | - |
8172

73+
### ActionSheetItemProps
8274
| 参数 | 说明 | 类型 | 默认值 |
8375
|------|------|-----|------|
8476
| containerStyle | 容器样式 | `StyleProp<ViewStyle>` | - |
8577
| textStyle | 文本样式 | `StyleProp<ViewStyle>` | - |
8678
| onPress | 点击 ActionSheetItem 触发的事件 | `(event: GestureResponderEvent) => void` | - |
79+

‎packages/core/src/Avatar/README.md‎

Lines changed: 9 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -26,32 +26,15 @@ export default Demo
2626

2727
```
2828

29-
### props
29+
### Props
3030

3131
继承 [View](https://facebook.github.io/react-native/docs/view#props) 组件。
3232

33-
```ts
34-
import { ViewProps } from 'react-native';
35-
36-
export interface AvatarProps extends ViewProps {
37-
/** React Native `Image` 组件 Props */
38-
imageProps?: ImageProps;
39-
/** 图像源（远程URL或本地文件资源）。 */
40-
src?: string | number;
41-
/**
42-
* 尺寸
43-
* @default 40
44-
*/
45-
size?: number;
46-
/**
47-
* 设置圆角
48-
* @default 3
49-
*/
50-
rounded?: number;
51-
/**
52-
* 指定头像的形状
53-
* @default square
54-
*/
55-
shape?: 'circle' | 'square';
56-
}
57-
```
33+
34+
| 参数 | 说明 | 类型 | 默认值 |
35+
|------|------|-----|------|
36+
| `imageProps` | React Native `Image` 组件 Props | obj | - |
37+
| `src` | 图像源（远程URL或本地文件资源） | `string|number` | - |
38+
| `size` | 尺寸 | number | - |
39+
| `rounded` | 设置圆角 | number | - |
40+
| `shape` |指定头像的形状 | `circle｜square` | - |

‎packages/core/src/Badge/README.md‎

Lines changed: 8 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -47,22 +47,11 @@ export default Demo;
4747

4848
继承 [View](https://facebook.github.io/react-native/docs/view#props) 组件。
4949

50-
```ts
51-
import { ViewProps } from 'react-native';
52-
53-
export interface BadgeProps extends ViewProps {
54-
children?: React.ReactNode;
55-
/** 标记颜色 */
56-
color?: colors.Colors | string;
57-
/** 文本内容 */
58-
text?: string | Element;
59-
/**
60-
* 设置圆角，默认 `12`
61-
*/
62-
rounded?: number;
63-
/** 设置类型 */
64-
type?: 'dot' | 'text';
65-
/** 文本样式 */
66-
textStyles?: StyleProp<TextStyle>;
67-
}
68-
```
50+
| 属性 | 说明 | 类型 | 默认值 |
51+
| --- | --- | --- | --- |
52+
| color | 标记颜色 | `colors.Colors \| string` | - |
53+
| text | 文本内容 | `string \| Element` | - |
54+
| rounded | 设置圆角 | `boolean \| number` | `12` |
55+
| textStyles | 文本样式 | `StyleProp<TextStyle>` | - |
56+
| type | 设置类型 | `'dot' \| 'text'` | - |
57+
| children | 更多内容 | `React.ReactNode` | - |

‎packages/core/src/Form/README.md‎

Lines changed: 35 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -267,90 +267,44 @@ const FormComponent = Form.create(FormDemo)
267267

268268
export default FormComponent;
269269
```
270-
End
271-
272-
273-
### FormProps
274-
```ts
275-
interface FormProps<FormData = any, FieldValue = FormData[keyof FormData], FieldKey extends KeyType = keyof FormData> {
276-
/**
277-
* 表单集合
278-
*/
279-
schema?: FormItemsProps[];
280-
/**
281-
* 经 Form.useForm() 创建的 form 控制实例，不提供时会自动创建
282-
*/
283-
form: FormInstance<FormData, FieldValue, FieldKey>;
284-
/**
285-
* 表单默认值，只有初始化以及重置时生效
286-
*/
287-
initialValues?: Partial<FormData>;
288-
/**
289-
* 支持默认和卡片两种模式
290-
*/
291-
mode?:'default' | 'card';
292-
// 表单是否在onChange时进行验证
293-
changeValidate?: boolean;
294-
// 监听表单字段变化
295-
watch?: Partial<Record<string, (value: unknown) => void>>;
296-
// 自定义组件
297-
customComponentList?: Partial<Record<string, JSX.Element>>;
298-
}
299-
```
270+
271+
### Props
272+
273+
| 参数 | 说明 | 类型 | 默认值 |
274+
|------|------|-----|------|
275+
| `schema` | 表单集合 | FormItemsProps[] | [] |
276+
| `form` | 经 Form.useForm() 创建的 form 控制实例，不提供时会自动创建 | FormInstance<`FormData`, `FieldValue`, `FieldKey`> | - |
277+
| `initialValues` | 表单默认值，只有初始化以及重置时生效 | Partial<`FormData`> | - |
278+
| `mode` | 支持默认和卡片两种模式 | `default` \| `card` | | default |
279+
| `changeValidate` | 表单是否在onChange时进行验证 | boolean | false |
280+
| `watch` | 监听表单字段变化 | Partial<Record<string, (value: unknown) => void>> | - |
281+
| `customComponentList` | 自定义组件 | Partial<Record<string, JSX.Element>> | - |
300282

301283
### FormItemsProps
302-
```ts
303-
interface FormItemsProps {
304-
// 字段名
305-
field: string;
306-
// 字段类型(默认继承了react-native-uiw中的 input | textArea | slider | rate | radio | search | switch | checkBox | stepper ｜ cardList )
307-
type: string;
308-
// 标签名
309-
name: string;
310-
// 验证规则
311-
validate?: RulesOption['validate'];
312-
options?: Array<{ label: string; value: KeyType }>;
313-
// 表单控件props
314-
attr?: any;
315-
// 展示是否必填
316-
required?: boolean;
317-
// 是否隐藏
318-
hide?:boolean
319-
// 当type为cardList生效,渲染每一项的头部内容
320-
renderHeader?:(index:number,{ remove }:{ remove:()=>void })=>React.ReactNode;
321-
// 当type为cardList生效,渲染添加按钮的文案
322-
renderAdd?:( { add }:{ add:()=>void } )=>React.ReactNode;
323-
// 当type为cardList生效,配置表单项
324-
items?: Omit<FormItemsProps, 'validate' | 'required'>[];
325-
}
326-
```
327284

328-
### FormInstance
329-
```ts
330-
type FormInstance<FormData = any, FieldValue = FormData[keyof FormData], FieldKey extends KeyType = keyof FormData> = {
331-
/**
332-
* 获取对应字段名的值
333-
*/
334-
getFieldValue: (field: FieldKey) => FieldValue;
335-
/**
336-
* 设置对应字段名的值
337-
*/
338-
setFieldValue: (field: FieldKey, value: FieldValue) => void;
339-
/**
340-
* 重制表单
341-
*/
342-
resetFieldValue: () => void;
343-
/**
344-
* 触发验证
345-
*/
346-
validate: () => Partial<Record<string, string>>;
347-
/**
348-
* 触发表单验证获取表单数据
349-
*/
350-
validateFields: () => Promise<FormData> | any;
351-
getInnerMethods: (inner?: boolean) => InnerMethodsReturnType<FormData>;
352-
};
353-
```
285+
| 参数 | 说明 | 类型 | 默认值 |
286+
|------|------|-----|------|
287+
| `field` | 字段名 | string | - |
288+
| `type` | 字段类型(默认继承了react-native-uiw中的 input | textArea | slider | rate | radio | search | switch | checkBox | stepper ｜ cardList ) | string | - |
289+
| `name` | 标签名 | string | - |
290+
| `validate` | 验证规则 | RulesOption['validate'] | - |
291+
| `options` | 集合 | Array<{ label: string; value: KeyType }> | - |
292+
| `attr` | 表单控件props | any | - |
293+
| `required` | 展示是否必填 | boolean | - |
294+
| `hide` | 是否隐藏 | boolean | - |
295+
| `renderHeader` | 当type为cardList生效,渲染每一项的头部内容 | (index:number,{ remove }:{ remove:()=>void })=>React.ReactNode | - |
296+
| `renderAdd` | 当type为cardList生效,渲染添加按钮的文案 | ( { add }:{ add:()=>void } )=>React.ReactNode | - |
297+
| `items` | 当type为cardList生效,配置表单项 | Omit<FormItemsProps, `validate` \| `required`>[] | - |
298+
299+
### FormInstanceProps
354300

301+
| 参数 | 说明 | 类型 | 默认值 |
302+
|------|------|-----|------|
303+
| `getFieldValue` | 获取对应字段名的值 | (field: FieldKey) => FieldValue | - |
304+
| `setFieldValue` | 设置对应字段名的值 | (field: FieldKey, value: FieldValue) => void | - |
305+
| `resetFieldValue` | 重制表单 | () => void | - |
306+
| `validate` | 触发验证 | () => Partial<Record<string, string>> | - |
307+
| `validateFields` | 触发表单验证获取表单数据 | () => Promise<FormData> \| any | - |
308+
| `getInnerMethods` | 组件内部方法集合 | (inner?: boolean) => InnerMethodsReturnType<FormData> | - |
355309

356310

‎packages/core/src/Grid/README.md‎

Lines changed: 17 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -88,44 +88,21 @@ function Demo() {
8888
export default Demo
8989

9090
```
91-
9291
### Props
93-
94-
95-
```ts
96-
interface ItemData {
97-
icon?: React.ReactNode;
98-
text?: React.ReactNode;
99-
}
100-
101-
```
102-
103-
```ts
104-
export interface GridProps extends ViewProps {
105-
/**
106-
* 传入的菜单数据，`icon` 可以是 `ReactNode` 或者 `uri`
107-
* @default []
108-
*/
109-
data?: ItemData[];
110-
/**
111-
* 列数
112-
* @default 4
113-
*/
114-
columns?: number;
115-
/**
116-
* 是否有间隔线
117-
* @default true
118-
*/
119-
hasLine?: boolean;
120-
/** 单元格样式 */
121-
itemStyle?: StyleProp<ViewStyle>;
122-
/** 单元格文本样式 */
123-
textStyle?: StyleProp<TextStyle & ViewStyle>;
124-
/** 图片样式，可设置图片/图标尺寸 */
125-
iconStyle?: StyleProp<ImageStyle & TextStyle & ViewStyle>;
126-
/** 自定义单元格 */
127-
renderItem?: (data: ItemData, index: number, row: number) => React.ReactNode;
128-
/** 点击宫格回调函数 */
129-
onPress?: (data: ItemData, index: number, row: number, event: GestureResponderEvent) => void;
130-
}
131-
```
92+
| 参数 | 说明 | 类型 | 默认值 |
93+
|------|------|-----|------|
94+
| data | 菜单数据，`icon` 可以是 `ReactNode` 或者 `uri` | `ItemData[]` | - |
95+
| columns | 列数 | `number` | 4 |
96+
| hasLine | 是否有间隔线 | `boolean` | true |
97+
| itemStyle | 单元格样式 | `StyleProp<ViewStyle>` | - |
98+
| textStyle | 单元格文本样式 | `StyleProp<TextStyle & ViewStyle>` | - |
99+
| iconStyle | 图片样式，可设置图片/图标尺寸 | `StyleProp<ImageStyle & TextStyle & ViewStyle>` | - |
100+
| renderItem | 自定义单元格 | `(data: ItemData, index: number, row: number) => React.ReactNode` | - |
101+
| onPress | 点击宫格回调函数 | `(data: ItemData, index: number, row: number, event: GestureResponderEvent) => void` | - |
102+
103+
104+
### ItemData
105+
| 参数 | 说明 | 类型 | 默认值 |
106+
|------|------|-----|------|
107+
| text | 显示文字 | `React.ReactNode` | - |
108+
| icon | 图标 | `React.ReactNode` | - |

‎packages/core/src/Input/README.md‎

Lines changed: 13 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -66,59 +66,27 @@ export default Demo
6666

6767
### Props
6868

69-
```tsx
70-
import { StyleProp,TextStyle,TextInputProps, NativeSyntheticEvent, TextInputFocusEventData, TextInputChangeEventData, KeyboardTypeOptions,ViewStyle } from 'react-native'
71-
72-
export interface InputProps extends TextInputProps {
73-
74-
/** 唤起键盘类型 详情 https://lefkowitz.me/visual-guide-to-react-native-textinput-keyboardtype-options/ */
75-
keyboardType?: KeyboardTypeOptions;
76-
/** 如果为 true，文本框是不可编辑的。默认值为 false */
77-
disabled?: boolean;
78-
/** 如果为 true，在componentDidMount后会获得焦点。默认值为 false。 */
79-
autoFocus?: boolean;
80-
/** 设置输入框高亮时的颜色（还包括光标）。 */
81-
selectionColor?: string;
82-
/** 如果为 true，则隐藏光标。默认值为 false。 */
83-
caretHidden?: boolean;
84-
/** 是否显示清除按钮 */
85-
clear?: boolean;
86-
/** 清除按钮样式 */
87-
clearStyle?: StyleProp<TextStyle>;
88-
/** 自定义清除元素 */
89-
renderClear?: React.ReactNode;
90-
/** 如果为 true，每次开始输入的时候都会清除文本框的内容。 */
91-
clearText?: boolean;
92-
/** 输入框前缀的额外的信息 */
93-
extraStart?: string|React.ReactNode
94-
/** 输入框末尾额外的信息 */
95-
extraEnd?: string|React.ReactNode
96-
/** 当文本框内容变化时调用此回调函数。改变后的文字内容会作为参数传递 */
97-
onChangeText?: ((text: string) => void);
98-
/** 当文本框失去焦点的时候调用此回调函数。 */
99-
onBlur?: ((e: NativeSyntheticEvent<TextInputFocusEventData>) => void);
100-
/** 当文本框内容变化时调用此回调函数。回调参数为{ nativeEvent: { eventCount, target, text} }。 */
101-
onChange?: ((e: NativeSyntheticEvent<TextInputChangeEventData>) => void);
102-
/** 输入框 ref */
103-
inputRef?: React.RefObject<TextInput>
104-
}
105-
106-
```
69+
> 更多 react-native Input 属性请参考 react-native TextInput (https://www.react-native.cn/docs/textinput)
10770
10871
| 参数 | 说明 | 类型 | 默认值 |
10972
|------|------|-----|------|
11073
| `value` | 输入框默认值 | string | - |
11174
| `rule` | 限制输入条件 | RegExp | - |
11275
| `wrongfulHandle` | 输入不合法时触发方法 | Function | - |
113-
| `maxLength` | 限制文本框中最多的字符数 | number | - |
114-
| `placeholder` | 如果没有任何文字输入，会显示此字符串 | string | - |
115-
| `style` | 输入框样式 | `StyleProp<TextStyle>` | - |
116-
| `containerStyle` | 容器样式 | `StyleProp<ViewStyle>` | - |
76+
| `disabled` | 文本框是否可编辑 | boolean | - |
77+
| `clearText` | 如果为 true，每次开始输入的时候都会清除文本框的内容。 | boolean | - |
11778
| `error` | 显示错误 | boolean | - |
11879
| `renderError` | 自定义错误提示 | React.ReactNode | - |
11980
| `border` | 边框 | `'bottom'|'top'|'left'|'right'|null|'always'` | - |
12081
| `borderColor` | 边框颜色 | string | - |
121-
| `keyboardType` | 唤起键盘类型 | KeyboardTypeOptions | - |
122-
82+
| `clear` | 是否显示清除按钮 | boolean | - |
83+
| `clearStyle` | 清除按钮样式 | StyleProp<`TextStyle`> | - |
84+
| `renderClear` | 自定义清除元素 | React.ReactNode | - |
85+
| `extraStart` | 输入框前缀的额外的信息 | string \| React.ReactNode | - |
86+
| `extraEnd` | 输入框末尾额外的信息 | string \| React.ReactNode | - |
87+
| `inputRef` | 输入框ref | React.RefObject<`TextInput`> | - |
88+
| `maxLength` | 限制文本框中最多的字符数 | number | - |
89+
| `placeholder` | 如果没有任何文字输入，会显示此字符串 | string | - |
90+
| `style` | 输入框样式 | `StyleProp<TextStyle>` | - |
91+
| `containerStyle` | 容器样式 | `StyleProp<ViewStyle>` | - |
12392

124-
> 更多 react-native Input 属性请参考 react-native TextInput (https://www.react-native.cn/docs/textinput)

0 commit comments

Comments
 (0)