ionic-team / ionic-team/ionic-framework

bug: `match.params` is always an empty object when using `Redirect` in `IonRouterOutlet`

Đang mở
#23,743 32 bình luận 21 reaction 0 người được giao Xem trên GitHub
package: react type: bug
Ngôn ngữ chính
TypeScript
Star
52.7k
Fork
13.3k
Merge trung bình
1 ngày 15 giờ
Pull request đã merge (30 ngày)
51

Mô tả

### Prequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

- [ ] v4.x
- [X] v5.x
- [ ] v6.x

### Current Behavior

When rendering a `Redirect` component in `IonRouterOutlet`, when navigating to other pages that utilise parameters in the URL (for example, /tab1`/:id`), the `match.params` object will always be empty. This means that parameters cannot be extracted using `useParams` or reading the `props.match.params` object directly.

### Expected Behavior

After a `Redirect` component is rendered and it takes the user to the desired page, I would expect any subsequent page visits to be populated with parameters if they are in the URL.

### Steps to Reproduce

To reproduce using the code reproduction repo listed:

1) Navigate to localhost:8100 (or the test app) in a new tab. This should load tab 2.
2) Click on "Tab 1". This should take you to `/tab1/TESTING`.
3) The page should read "Tab 1 with param: undefined" when it should actually say "Tab 1 with param: TESTING".

### Code Reproduction URL

https://github.com/Nevvulo/ionic-router-redirect-issue

### Ionic Info

Ionic:

Ionic CLI : 6.16.3 (/Users/bswar/.nvm/versions/node/v14.16.0/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/react 5.6.13

Utility:

cordova-res : not installed globally
native-run : not installed globally

System:

NodeJS : v14.16.0 (/Users/bswar/.nvm/versions/node/v14.16.0/bin/node)
npm : 6.14.11
OS : macOS Big Sur

### Additional Information

Related issues: https://github.com/ionic-team/ionic-framework/issues/22230

It's worth mentioning that the official documentation for v5 states that this is valid for a fallback route: https://ionicframework.com/docs/react/navigation#fallback-route

Here is the diff containing just the changes that introduce the problem: https://github.com/Nevvulo/ionic-router-redirect-issue/commit/dfb52bacad714864a8faf1ae435d456eb0a5b956

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.