{"record":{"id":"44ee42a4bb5cba8a","repo":"vuejs/vue-router","slug":"router-link-s-event-prop-is-deprecated-and-has-b","errorCode":null,"errorMessage":"<router-link>'s event prop is deprecated and has been removed in Vue Router 4. Use the v-slot API to remove this warning: https://next.router.vuejs.org/guide/migration/#removal-of-event-and-tag-props","messagePattern":"<router-link>'s event prop is deprecated and has been removed in Vue Router 4\\. Use the v-slot API to remove this warning: https://next\\.router\\.vuejs\\.org/guide/migration/#removal-of-event-and-tag-props","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"src/components/link.js","lineNumber":143,"sourceCode":"            `<router-link> with to=\"${\n              this.to\n            }\" is trying to use a scoped slot but it didn't provide exactly one child. Wrapping the content with a span element.`\n          )\n        }\n        return scopedSlot.length === 0 ? h() : h('span', {}, scopedSlot)\n      }\n    }\n\n    if (process.env.NODE_ENV !== 'production') {\n      if ('tag' in this.$options.propsData && !warnedTagProp) {\n        warn(\n          false,\n          `<router-link>'s tag prop is deprecated and has been removed in Vue Router 4. Use the v-slot API to remove this warning: https://next.router.vuejs.org/guide/migration/#removal-of-event-and-tag-props-in-router-link.`\n        )\n        warnedTagProp = true\n      }\n      if ('event' in this.$options.propsData && !warnedEventProp) {\n        warn(\n          false,\n          `<router-link>'s event prop is deprecated and has been removed in Vue Router 4. Use the v-slot API to remove this warning: https://next.router.vuejs.org/guide/migration/#removal-of-event-and-tag-props-in-router-link.`\n        )\n        warnedEventProp = true\n      }\n    }\n\n    if (this.tag === 'a') {\n      data.on = on\n      data.attrs = { href, 'aria-current': ariaCurrentValue }\n    } else {\n      // find the first <a> child and apply listener and href\n      const a = findAnchor(this.$slots.default)\n      if (a) {\n        // in case the <a> is a static node\n        a.isStatic = false\n        const aData = (a.data = extend({}, a.data))\n        aData.on = aData.on || {}","sourceCodeStart":125,"sourceCodeEnd":161,"githubUrl":"https://github.com/vuejs/vue-router/blob/680ccc68c506cca9be6207745043245d61fa715a/src/components/link.js#L125-L161","documentation":"resolveProps validates the props config of a route component: it may be an object, a function (route)=>props, or a boolean. Anything else (string, number, undefined-with-bad-shape, array) hits the default branch and warns in dev that props in the given route path is of the wrong type. The props are then not passed to the route component.","triggerScenarios":"Defining a route with props set to an invalid value, e.g. props: 'true' (string), props: 123, props: [], or props set via a route record mismatch; then navigating to that route so resolveProps runs with the bad config.","commonSituations":"Typo like props: 'true' instead of props: true; copying config from Vue Router 4 where boolean props semantics changed; generating routes dynamically and assigning wrong types.","solutions":["Change the route's props config to an object, function, or boolean.","If you meant params-as-props, use props: true (boolean) or props: route => ({ id: route.params.id }).","Log the config at route-creation time to catch bad types early."],"exampleFix":"// before\n{ path: '/user/:id', component: User, props: 'true' }\n// after\n{ path: '/user/:id', component: User, props: true }","handlingStrategy":"validation","validationCode":"// validate props config type when defining routes\nconst VALID = ['object', 'function', 'boolean']\nfunction validateRouteProps (route) {\n  if ('props' in route && !VALID.includes(typeof route.props)) {\n    throw new TypeError(`route ${route.path}: props must be object, function or boolean`)\n  }\n}","typeGuard":"function isValidPropsConfig (c) {\n  return ['object', 'function', 'boolean'].includes(typeof c) && c !== null\n}","tryCatchPattern":"// router-level: normalize at route definition time\n{ path: '/user/:id', component: User, props: (route) => ({ id: route.params.id }) }","preventionTips":["Use props: true for params-as-props, functions for computed props, objects for static props.","Avoid string booleans like 'true' — JS typing trap.","Validate route config programmatically when routes are generated dynamically.","Keep route definitions centralized and typed (JSDoc/TS) to catch bad shapes."],"tags":["vue-router","props","route-config","type-error"],"backgroundTag":"route-props-invalid-type","analyzedSha":"680ccc68c506cca9be6207745043245d61fa715a","analyzedAt":"2026-09-02T19:19:01.204Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-10T02:17:09.455Z"}