From 1eb085400fa8f77ccd26655145988731e30a534e Mon Sep 17 00:00:00 2001 From: sesont97 Date: Sat, 11 Oct 2025 09:19:56 +0800 Subject: [PATCH] =?UTF-8?q?docs:=20=E8=A1=A5=E5=85=85react-native-paper?= =?UTF-8?q?=E5=BA=93=E6=96=87=E6=A1=A3=E5=88=97=E6=95=B0=E6=8D=AE=E3=80=81?= =?UTF-8?q?=E8=A1=A5=E5=85=85=E5=85=B6=E4=BB=96=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- en/react-native-paper.md | 27 ++++++++++++++------------- zh-cn/react-native-paper.md | 27 ++++++++++++++------------- 2 files changed, 28 insertions(+), 26 deletions(-) diff --git a/en/react-native-paper.md b/en/react-native-paper.md index 0a57ecee..31e55363 100644 --- a/en/react-native-paper.md +++ b/en/react-native-paper.md @@ -700,7 +700,7 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen | compact | Sets smaller horizontal paddings 12dp around label, when there is only label. | boolean | NO | All | Yes | | elevated | Whether chip should have the elevation. | boolean | NO | All | Yes | | textStyle | Style of chip's text | StyleProp | NO | All | Yes | -| style | style | Animated.WithAnimatedValue> | NO | All | +| style | style | Animated.WithAnimatedValue> | NO | All | Yes | | theme | theme | ThemeProp | NO | All | Yes | | testID | Pass down testID from chip props to touchable for Detox tests. | string | NO | All | Yes | | ellipsizeMode | Ellipsize Mode for the children text | EllipsizeProp | NO | All | Yes | @@ -712,7 +712,7 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen | Name | Description | Type | Required | Platform | HarmonyOS Support | | :-----: | :---------: | :-------------: | -------- | -------- | ----------------- | | children (required) | Content of the DataTable | React.ReactNode | Yes | All | Yes | -| style | style | StyleProp | NO | All | +| style | style | StyleProp | NO | All | Yes | **DataTable.Cell**：A component to show a single cell inside of a table. @@ -721,18 +721,18 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen | children (required) | Content of the DataTableCell. | React.ReactNode | Yes | All | Yes | | numeric | Align the text to the right. Generally monetary or number fields are aligned to right. | boolean | NO | All | Yes | | onPress | Function to execute on press. | (e: GestureResponderEvent) => void | NO | All | Yes | -| style | Text content style of the DataTableCell. | StyleProp | NO | All | +| style | Text content style of the DataTableCell. | StyleProp | NO | All | Yes | | textStyle | Text content style of the DataTableCell. | StyleProp | NO | All | Yes | | maxFontSizeMultiplier | Specifies the largest possible scale a text font can reach. | number | NO | All | Yes | -| testID | testID to be used on tests. | string | NO | All | +| testID | testID to be used on tests. | string | NO | All | Yes | **DataTable.Header**：A component to display title in table header. | Name | Description | Type | Required | Platform | HarmonyOS Support | | :-----: | :---------: | :-------------: | -------- | -------- | ----------------- | | children (required) | Content of the DataTableHeader. | React.ReactNode | Yes | All | Yes | -| style | Text content style of the DataTable.Header. | StyleProp | NO | All | -| theme | theme | ThemeProp | NO | All | +| style | Text content style of the DataTable.Header. | StyleProp | NO | All | Yes | +| theme | theme | ThemeProp | NO | All | Yes | **DataTable.Pagination**：A component to show pagination for data table. @@ -743,7 +743,7 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen | onPageChange (required) | Function to execute on page change. | (page: number) => void | Yes | All | Yes | | showFastPaginationControls | Whether to show fast forward and fast rewind buttons in pagination. False by default. | boolean | NO | All | Yes | | paginationControlRippleColor | Color of the pagination control ripple effect. | ColorValue | NO | All | Yes | -| theme | theme | ThemeProp | NO | All | +| theme | theme | ThemeProp | NO | All | Yes | | numberOfItemsPerPage | The current number of rows per page. | number | NO | All | Yes | | numberOfItemsPerPageList | Options for a number of rows per page to choose from. | Array | NO | All | Yes | | onItemsPerPageChange | The function to set the number of rows per page. | (numberOfItemsPerPage: number) => void | NO | All | Yes | @@ -753,7 +753,7 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen | selectPageDropdownAccessibilityLabel | AccessibilityLabel for selectPageDropdownLabel | string | NO | All | Yes | | label | Label text to display which indicates current pagination. | React.ReactNode | NO | All | Yes | | accessibilityLabel | AccessibilityLabel for label. | string | NO | All | Yes | -| style | Text content style of the DataTable.Pagination. | StyleProp | NO | All | +| style | Text content style of the DataTable.Pagination. | StyleProp | NO | All | Yes | **DataTable.Row**：A component to show a single row inside of a table. @@ -762,9 +762,9 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen | TouchableRipple | Extends: ...TouchableRipple props | props | NO | All | Yes | | children (required) | Content of the DataTableRow. | React.ReactNode | Yes | All | Yes | | onPress | Function to execute on press. | (e: GestureResponderEvent) => void | NO | All | Yes | -| style | Text content style of the DataTable.Pagination. | StyleProp | NO | All | -| theme | theme | ThemeProp | NO | All | -| pointerEvents | pointerEvents passed to the View container, which is wrapping children within TouchableRipple. | ViewProps['pointerEvents'] | NO | All | +| style | Text content style of the DataTable.Pagination. | StyleProp | NO | All | Yes | +| theme | theme | ThemeProp | NO | All | Yes | +| pointerEvents | pointerEvents passed to the View container, which is wrapping children within TouchableRipple. | ViewProps['pointerEvents'] | NO | All | No | **DataTable.Title**：A component to display title in table header. @@ -1077,7 +1077,7 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen | visible (required) | Whether the Menu is currently visible. | boolean | Yes | All | Yes | | anchor (required) | The anchor to open the menu from. In most cases, it will be a button that opens the menu. | React.ReactNode \| { x: number; y: number } | Yes | All | Yes | | anchorPosition | Whether the menu should open at the top of the anchor or at its bottom. | top \| bottom | NO | All | Yes | -| statusBarHeight | Extra margin to add at the top of the menu to account for translucent status bar on Android. If you are using Expo, we assume translucent status bar and set a height for status bar automatically. | number | NO | Android | false | +| statusBarHeight | Extra margin to add at the top of the menu to account for translucent status bar on Android. If you are using Expo, we assume translucent status bar and set a height for status bar automatically. | number | NO | Android | Yes | | onDismiss | Callback called when Menu is dismissed. | fuction | NO | All | Yes | | overlayAccessibilityLabel | Accessibility label for the overlay. This is read by the screen reader when the user taps outside the menu. | string | NO | All | Yes | | children (required) | Content of the Menu | React.ReactNode | Yes | All | Yes | @@ -1118,7 +1118,7 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen | children (required) | Content of the Modal. | React.ReactNode | Yes | All | Yes | | contentContainerStyle | Style for the content of the modal | Animated.WithAnimatedValue> | NO | All | Yes | | theme | theme | ThemeProp | NO | All | Yes | -| style | Style for the wrapper of the modal. Use this prop to change the default wrapper style or to override safe area insets with marginTop and marginBottom. | StyleProp | NO | All | +| style | Style for the wrapper of the modal. Use this prop to change the default wrapper style or to override safe area insets with marginTop and marginBottom. | StyleProp | NO | All | Yes | | testID | testID to be used on tests. | string | NO | All | Yes | **Portal**：Portal allows rendering a component at a different place in the parent tree. @@ -1390,6 +1390,7 @@ View details[Paper](https://callstack.github.io/react-native-paper/docs/componen - The mode property in the Menu component is a new addition in version[5.12.4 Version added](https://github.com/callstack/react-native-paper/releases/tag/v5.12.4),and the current version is 5.12.3. - The statusBarHeight property in the Menu component has no effect, as this property is exclusive to the Android platform. [Source code location](https://github.com/callstack/react-native-paper/blob/v5.12.3/src/components/Menu/Menu.tsx#L447) - The ripple effect produced by the DataTableRow component using TouchableRipple works on Android but not on iOS. +- The DataTableRow component currently has no effect when using pointerEvents on HarmonyOS RN. - The safeAreaInset top property in BottomNavigation has no effect because it is not used in the source code. [Source code location](https://github.com/callstack/react-native-paper/blob/v5.12.3/src/components/BottomNavigation/BottomNavigationBar.tsx#L580) - The keyboardHidesNavigationBar property in the BottomNavigation.Bar component is passed from the parent component BottomNavigation and should not be used standalone. - The accessibilityState property is not supported in HarmonyOS RN (5.0.0.700). diff --git a/zh-cn/react-native-paper.md b/zh-cn/react-native-paper.md index 84c6f9d2..89193546 100644 --- a/zh-cn/react-native-paper.md +++ b/zh-cn/react-native-paper.md @@ -699,7 +699,7 @@ export default function App() { | compact | Sets smaller horizontal paddings 12dp around label, when there is only label. | boolean | NO | All | Yes | | elevated | Whether chip should have the elevation. | boolean | NO | All | Yes | | textStyle | Style of chip's text | StyleProp | NO | All | Yes | -| style | style | Animated.WithAnimatedValue> | NO | All | +| style | style | Animated.WithAnimatedValue> | NO | All | Yes | | theme | theme | ThemeProp | NO | All | Yes | | testID | Pass down testID from chip props to touchable for Detox tests. | string | NO | All | Yes | | ellipsizeMode | Ellipsize Mode for the children text | EllipsizeProp | NO | All | Yes | @@ -711,7 +711,7 @@ export default function App() { | Name | Description | Type | Required | Platform | HarmonyOS Support | | :-----: | :---------: | :-------------: | -------- | -------- | ----------------- | | children (required) | Content of the DataTable | React.ReactNode | Yes | All | Yes | -| style | style | StyleProp | NO | All | +| style | style | StyleProp | NO | All | Yes | **DataTable.Cell**：A component to show a single cell inside of a table. @@ -720,18 +720,18 @@ export default function App() { | children (required) | Content of the DataTableCell. | React.ReactNode | Yes | All | Yes | | numeric | Align the text to the right. Generally monetary or number fields are aligned to right. | boolean | NO | All | Yes | | onPress | Function to execute on press. | (e: GestureResponderEvent) => void | NO | All | Yes | -| style | Text content style of the DataTableCell. | StyleProp | NO | All | +| style | Text content style of the DataTableCell. | StyleProp | NO | All | Yes | | textStyle | Text content style of the DataTableCell. | StyleProp | NO | All | Yes | | maxFontSizeMultiplier | Specifies the largest possible scale a text font can reach. | number | NO | All | Yes | -| testID | testID to be used on tests. | string | NO | All | +| testID | testID to be used on tests. | string | NO | All | Yes | **DataTable.Header**：A component to display title in table header. | Name | Description | Type | Required | Platform | HarmonyOS Support | | :-----: | :---------: | :-------------: | -------- | -------- | ----------------- | | children (required) | Content of the DataTableHeader. | React.ReactNode | Yes | All | Yes | -| style | Text content style of the DataTable.Header. | StyleProp | NO | All | -| theme | theme | ThemeProp | NO | All | +| style | Text content style of the DataTable.Header. | StyleProp | NO | All | Yes | +| theme | theme | ThemeProp | NO | All | Yes | **DataTable.Pagination**：A component to show pagination for data table. @@ -742,7 +742,7 @@ export default function App() { | onPageChange (required) | Function to execute on page change. | (page: number) => void | Yes | All | Yes | | showFastPaginationControls | Whether to show fast forward and fast rewind buttons in pagination. False by default. | boolean | NO | All | Yes | | paginationControlRippleColor | Color of the pagination control ripple effect. | ColorValue | NO | All | Yes | -| theme | theme | ThemeProp | NO | All | +| theme | theme | ThemeProp | NO | All | Yes | | numberOfItemsPerPage | The current number of rows per page. | number | NO | All | Yes | | numberOfItemsPerPageList | Options for a number of rows per page to choose from. | Array | NO | All | Yes | | onItemsPerPageChange | The function to set the number of rows per page. | (numberOfItemsPerPage: number) => void | NO | All | Yes | @@ -752,7 +752,7 @@ export default function App() { | selectPageDropdownAccessibilityLabel | AccessibilityLabel for selectPageDropdownLabel | string | NO | All | Yes | | label | Label text to display which indicates current pagination. | React.ReactNode | NO | All | Yes | | accessibilityLabel | AccessibilityLabel for label. | string | NO | All | Yes | -| style | Text content style of the DataTable.Pagination. | StyleProp | NO | All | +| style | Text content style of the DataTable.Pagination. | StyleProp | NO | All | Yes | **DataTable.Row**：A component to show a single row inside of a table. @@ -761,9 +761,9 @@ export default function App() { | TouchableRipple | Extends: ...TouchableRipple props | props | NO | All | Yes | | children (required) | Content of the DataTableRow. | React.ReactNode | Yes | All | Yes | | onPress | Function to execute on press. | (e: GestureResponderEvent) => void | NO | All | Yes | -| style | Text content style of the DataTable.Pagination. | StyleProp | NO | All | -| theme | theme | ThemeProp | NO | All | -| pointerEvents | pointerEvents passed to the View container, which is wrapping children within TouchableRipple. | ViewProps['pointerEvents'] | NO | All | +| style | Text content style of the DataTable.Pagination. | StyleProp | NO | All | Yes | +| theme | theme | ThemeProp | NO | All | Yes | +| pointerEvents | pointerEvents passed to the View container, which is wrapping children within TouchableRipple. | ViewProps['pointerEvents'] | NO | All | No | **DataTable.Title**：A component to display title in table header. @@ -1076,7 +1076,7 @@ export default function App() { | visible (required) | Whether the Menu is currently visible. | boolean | Yes | All | Yes | | anchor (required) | The anchor to open the menu from. In most cases, it will be a button that opens the menu. | React.ReactNode \| { x: number; y: number } | Yes | All | Yes | | anchorPosition | Whether the menu should open at the top of the anchor or at its bottom. | top \| bottom | NO | All | Yes | -| statusBarHeight | Extra margin to add at the top of the menu to account for translucent status bar on Android. If you are using Expo, we assume translucent status bar and set a height for status bar automatically. | number | NO | Android | false | +| statusBarHeight | Extra margin to add at the top of the menu to account for translucent status bar on Android. If you are using Expo, we assume translucent status bar and set a height for status bar automatically. | number | NO | Android | Yes | | onDismiss | Callback called when Menu is dismissed. | fuction | NO | All | Yes | | overlayAccessibilityLabel | Accessibility label for the overlay. This is read by the screen reader when the user taps outside the menu. | string | NO | All | Yes | | children (required) | Content of the Menu | React.ReactNode | Yes | All | Yes | @@ -1117,7 +1117,7 @@ export default function App() { | children (required) | Content of the Modal. | React.ReactNode | Yes | All | Yes | | contentContainerStyle | Style for the content of the modal | Animated.WithAnimatedValue> | NO | All | Yes | | theme | theme | ThemeProp | NO | All | Yes | -| style | Style for the wrapper of the modal. Use this prop to change the default wrapper style or to override safe area insets with marginTop and marginBottom. | StyleProp | NO | All | +| style | Style for the wrapper of the modal. Use this prop to change the default wrapper style or to override safe area insets with marginTop and marginBottom. | StyleProp | NO | All | Yes | | testID | testID to be used on tests. | string | NO | All | Yes | **Portal**：Portal allows rendering a component at a different place in the parent tree. @@ -1389,6 +1389,7 @@ export default function App() { - Menu组件中的mode属性为[5.12.4版本新增](https://github.com/callstack/react-native-paper/releases/tag/v5.12.4)，当前版本为5.12.3 - Menu statusBarHeight 无效果，此属性为Android平台独有 [源码位置](https://github.com/callstack/react-native-paper/blob/v5.12.3/src/components/Menu/Menu.tsx#L447) - DataTableRow 组件使用 TouchableRipple 产生的涟漪效果，在Android上生效，iOS无效果 +- DataTableRow 组件目前使用 pointerEvents 在鸿蒙RN上无效果 - BottomNavigation safeAreaInset top属性无效果，因为在源码中未使用 [源码位置](https://github.com/callstack/react-native-paper/blob/v5.12.3/src/components/BottomNavigation/BottomNavigationBar.tsx#L580) - BottomNavigation.Bar组件 keyboardHidesNavigationBar属性为父组件BottomNavigation传入，请勿单独使用 - accessibilityState属性鸿蒙RN（5.0.0.700）不支持该属性 -- Gitee