Fix: Prevent error in Whiteboard when adding a Deckboard #7325
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Problem
Embedding a Deck board (Vue + Vue Router) inside the Whiteboard app (React) caused a runtime error. The Deck component attempted to access
this.$route.params.cardIdduring initialization — but when running inside Whiteboard, there’s no Vue Router context, sothis.$routewas undefined, triggering:TypeError: can't access property "params", this.$route is undefinedRoot Cause
In
Board.vue, thefetchData()method runs in thecreated()hook and directly referencesthis.$route.params.cardId. This works in the full Deck app but fails when embedded.Solution
Added optional chaining to safely access route data:
const routeCardId = this.$route?.params?.cardId ? parseInt(this.$route.params.cardId) : nullTODO
Checklist