callstack / callstack/react-native-paper

Using AppBar with MaterialBottomTabNavigator

Đang mở
#4,098 1 bình luận 0 reaction 0 người được giao Xem trên GitHub
bug
Ngôn ngữ chính
TypeScript
Star
14.5k
Fork
2.2k
Merge trung bình
5 ngày 23 giờ
Pull request đã merge (30 ngày)
12

Mô tả

### Current behaviour
Bottom Tab Navigators do not include the `header` property in `screenOptions` preventing a default `AppBar` from being included.

```
Type '{ header: ({ navigation, route, options, back }: { navigation: any; route: any; options: any; back: any; }) => Element; }' is not assignable to type 'MaterialBottomTabNavigationOptions | ((props: { route: RouteProp; navigation: any; }) => MaterialBottomTabNavigationOptions) | undefined'.
Object literal may only specify known properties, and 'header' does not exist in type 'MaterialBottomTabNavigationOptions | ((props: { route: RouteProp; navigation: any; }) => MaterialBottomTabNavigationOptions)'.ts(2322)
types.d.ts(30, 5): The expected type comes from property 'screenOptions' which is declared here on type 'IntrinsicAttributes & Omit & { id?: string | undefined; children: ReactNode; screenListeners?: Partial<...> | ... 1 more ... | undefined; screenOptions?: MaterialBottomTabNavigationOptions | ... 1 more ... | undefined; } & DefaultRouterOptions & { ...; } & Partial<...>, "children" | ... ...'
```

### Expected behaviour
Clear documentation is provided that details how to include a default header (i.e. an `AppBar`) when using `createMaterialBottomTabNavigator`.

### How to reproduce?
```
const Tab = createMaterialBottomTabNavigator();

{
const title = getHeaderTitle(options, route.name);
return (




);
},
}}>
```

### See Also
https://callstack.github.io/react-native-paper/docs/guides/react-navigation
https://callstack.github.io/react-native-paper/docs/guides/bottom-navigation

### Your Environment

| software | version
| --------------------- | -------
| react-native | 0.72.5
| react-native-paper | 5.10.6
| node | 18.17.1
| npm or yarn | 10.1.0
| expo sdk | 49.0.11

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.