vue-router icon indicating copy to clipboard operation
vue-router copied to clipboard

Accepting named target for router-link

Open service-paradis opened this issue 4 years ago • 2 comments

What problem does this feature solve?

Right now, if we want to open a link in a new tab (or page), we can use target="_blank".

In some cases, I prefer using named target when opening a new tab. This way, if we click multiple times on the same link, it will only refresh the named tab already opened.

Accepting something like target="my_report" would be great. Right now, the target attribute is added to the a tag, but the link is not opened on another tab.

What does the proposed API look like?

Accepting named target and opening them in new tabs

service-paradis avatar Feb 06 '20 17:02 service-paradis

Maybe we shouldn't listen to the click event if target is present, treating the anchor as a regular link and not using pushState at all

For the moment, you can use the v-slot api:

<router-link
  to="/foo"
  v-slot="{ href }"
>
    <a :href="href" target="my_report">Link</a>
  </li>
</router-link>

posva avatar Feb 06 '20 17:02 posva

it works now, but can't be compiled with lang='tsx' (vue-router 4.1.6):

error TS2322: Type '{ to: { name: string; params: { id: string; }; }; target: string; class: string; }' is not assignable to type 'IntrinsicAttributes & AllowedComponentProps & ComponentCustomProps & VNodeProps & RouterLinkProps'.
  Property 'target' does not exist on type 'IntrinsicAttributes & AllowedComponentProps & ComponentCustomProps & VNodeProps & RouterLinkProps'.

skiped type check by:

export const RouterLinkX = RouterLink as any;

then use RouterLinkX to replace RouterLink in

fy0 avatar Mar 31 '24 12:03 fy0