File tree Expand file tree Collapse file tree 1 file changed +6
-0
lines changed Expand file tree Collapse file tree 1 file changed +6
-0
lines changed Original file line number Diff line number Diff line change @@ -96,11 +96,16 @@ const DynamicUserBreadcrumb = ({ match }) => (
96
96
< span> {userNamesById[match .params .userId ]}< / span>
97
97
);
98
98
99
+ const CustomPropsBreadcrumb = ({ someProp }) => (
100
+ < span> {someProp}< / span>
101
+ );
102
+
99
103
// define custom breadcrumbs for certain routes.
100
104
// breadcumbs can be components or strings.
101
105
const routes = [
102
106
{ path: ' /users/:userId' , breadcrumb: DynamicUserBreadcrumb },
103
107
{ path: ' /example' , breadcrumb: ' Custom Example' },
108
+ { path: ' /custom-props, breadcrumb: CustomPropsBreadcrumb, props: { someProp: ' Hi' }},
104
109
];
105
110
106
111
// map & render your breadcrumb components however you want.
@@ -129,6 +134,7 @@ Pathname | Result
129
134
/users | Home / Users
130
135
/users/1 | Home / Users / John
131
136
/example | Home / Custom Example
137
+ /custom-props | Home / Hi
132
138
133
139
## [Route object](https://reactrouter.com/docs/en/v6/examples/route-objects) compatibility
134
140
You can’t perform that action at this time.
0 commit comments