One question I have is related to routing in Vue.js:
// routes.js
{ path: '/posts', name: 'Posts', component: PostsView },
{
path: '/post/:post_id',
name: 'PostRead',
component: PostReadView,
},
{
path: '/post/cu/:post_id?',
name: 'PostCreateUpdate',
component: PostCreateUpdateView,
},
// PostCreateUpdate.vue
mounted: function() {
if( this.$route.params.post_id ) {
this.$store.dispatch('getPost', this.$route.params.post_id);
}
},
My dilemma arises when accessing the PostCreateUpdate component through a router-link:
<router-link :to="{ name: 'PostCreateUpdate' }">Create</router-link>Everything works smoothly, but when reloading the page or directly altering the URL to /post/cu/, an unexpected behavior occurs. The framework seems to interpret "cu" as a parameter for /post/, leading to the wrong component being loaded with incorrect data. How can I prevent this issue?