ionic-team / ionic-team/ionic-framework
bug: Vue: Incorrect href [object Object] when using router-link object
- 主要言語
- TypeScript
- スター
- 52.7k
- フォーク
- 13.3k
- 平均マージ
- 1日 15時間
- マージ済み PR(30日)
- 51
説明
### Prerequisites
- [x] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/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
v8.x
### Current Behavior
When using the router-link attribute on Ionic Vue components (e.g. ``,` `), and passing a Vue Router location object such as:
`Details`
the component navigates correctly, but the generated DOM contains incorrect href values.
Both the host element and the internal Shadow DOM anchor render `[object Object]` instead of the resolved URL.
Example rendered output:
```
```
This results in:
- Browser status bar showing [object Object] on hover
- Incorrect link preview for assistive technologies
- No way to know the actual target URL from DOM
- Real href never being exposed, navigation works only via JS event interception
### Expected Behavior
Ionic should resolve `{ name: 'details' }` into the actual route URL (e.g. `/details`) and reflect it either:
- on the host element (`routerlink="/details"`)
- or on the internal `` element inside Shadow DOM (`href="/details"`)
So that:
- browser hover shows the correct URL
- accessibility tools detect the correct destination
- the link behaves like a normal anchor
- DOM correctly represents the navigation target
### Steps to Reproduce
1. Create an Ionic Vue project.
2. Add a component using router-link with an object:
```
Details
```
3. Hover over the component.
4. Inspect the DOM.
Result: both the routerlink attribute and the internal `` contain `[object Object] `
### Code Reproduction URL
https://v6ckjp.csb.app/
### Ionic Info
```
Ionic:
Ionic CLI : 7.2.1
Ionic Framework : @ionic/vue 8.7.11
Capacitor:
Capacitor CLI : 7.4.4
@capacitor/android : 7.4.4
@capacitor/core : 7.4.4
@capacitor/ios : 7.4.4
Utility:
cordova-res : not installed globally
native-run : 2.0.1
System:
NodeJS : v22.13.1
npm : 10.9.2
OS : Linux 6.8
```
### Additional Information
_No response_
コントリビューションガイド
評価
この issue はまだ評価されていません。