I encountered a curious case during development. I have a modal component that warns users about a change in price: If a user clicks the button I want the page to reload and automatically run the onMounted hook, after that…
I have a button which would enable and disable based on the mandatory form fields. When the button is enabled, clicking would have the ripple effect. I want to add the ripple effect when the button is disabled as well.…
I'm creating my own role/rights system because the ones that are available for Vue don't work. I now hide the element when a user does not have the appropriate role. But what I actually want is to not render the…
I'm trying to pass as a prop attribute some input fields and emit it to the parent component, but can't edit the input fields. I'm passing props down as a titled v-model to the child component. I think I'm wrong…
I'm making an animated clickable gallery using Vue 3 transition-group. Everything works fine except there is a small jump when the gallery slide goes from one side to the other, I've narrowed this down to being an issue with scaling…
In a Nuxt3 project I am using Firebase auth. I have created the following middleware to protect not authenticated routes: export default defineNuxtRouteMiddleware((to, from) => { const { $auth } = useNuxtApp(); const { $localePath } = useNuxtApp(); if(!$auth?.currentUser?.uid){ return…
I have a code that was in a .ts file that I wanted to import into a.vue file for consistency. In the .ts file, I have some functions inside an exported namespace. The issue is when I keep that in…
I try to create a plugin in nuxt3 that uses highligh.js and use it on my components. But I can't do it I make this : // @/plugins/highlight.js import 'highlight.js/styles/stackoverflow-light.css' import hljs from 'highlight.js/lib/core'; import json from 'highlight.js/lib/languages/json'; hljs.registerLanguage('json', json);…
I don't want the top of the navigation to be hidden when I scroll to the bottom of the page and see the footer. Below is the state before scrolling. Below is a screenshot when scrolling down to the page.…
i am using vuejs3 with options api. as shown in the code posted below, i create a compsable class ClsUseStates.js, in which the value of state changes every second. in app.vue, i instantiated an object of ClsUseStates and when the…