In a vue 3 application that uses composition api, I want to do one of 2 things based on if an authenticated user is verified or not. So if the user is not verified, send the user to the verification page. But if the user is verified, send the user to the dashboard. To achieve this, I am using navigation
Tag: vuejs3
Vue 3 Composition API ref primitive property not reactive
So while building a tab system I’m taking advantage of useSlots and props in order to create an array of titles (these are the titles of every tab that I open in my tab system), then I create a ref property called selectedTitle in order to bind that title to a class and add css to highlight the tab selected
Can’t get Vue 3 child component to properly recognize prop data
I have a parent and child component in Vue 3. I’m using the options (old) API. I am passing data, an object with a bunch of different properties and values, as a prop like this: When I do this, I get TypeError: Cannot read properties undefined (reading ‘isCustomizable’). Seems like maybe Vue is trying to read itemInfo.isCustomizable before the prop
How to toggle colors in list in Vue?
I have a tree-view component: my not working script: I just want to toggle the item’s color, which I choosed, that is when I click an item(im my code this item has @click event) I want to this item change its color to another, but its huge problem to me to turn back previous item to initial color. Ive struggled
Mitt event bus, not working inside axios interceptor but works fine in my vue components
I’m working with VueJs and mitt for the eventBus, the mitt is loaded globally as you can see and works fine : main.js I call the eventBus in all my component like that : it works fine this.emitter.emit(‘eventName’, data) My problem is when I use that inside axios interceptor I get an error ( undefined ) my client.js ( axios
Reactive chart with vue-chartjs throws “Maximum call stack size exceeded”
I tried to build a reactive chart with vue-chartjs (Vue v3, Vue ChartJS v4, ChartJS v3). But instead of updating the data in the diagram it just throws the following stack trace every time the interval functions for data computation gets executed: I have no clue where to look for the error. I understand that it hints maybe a recursion
How can i filter records from proxy in VUE3?
I am using ref() to store data from firebase. But when I am trying to filter and get the single record. It looks something like the below. But it is not supposed to. I should return a single object. Below is my code, Please guide me where i am wrong. Answer In Vue 3, ref() performs a deep reactive operation
scrollTop using computed in vue.js
Here is part of my code The button doesn’t disappear when i scroll the page to the top. Answer You need to listen to scroll event, try like following snippet:
Vuejs : how to bind class within a v-for loop
In Vuejs3, I’m looping over an array of objects : I want to add the class ‘border-b-2’ only to the line selected line, but I don’t see how to do that dynamically. When I now set isSelected to true in the vue devtools, all lines get that style applied. As a workaround, what I now do is wrapping this code
How to prevent user from entering value below 1 in Vue 3 number input
I am attempting to set up a number input field in Vue 3 that prevents the user from entering a value below 1. So far I have the following input with min = 1 to prevent clicking the input arrows below 1: However, the user can still manually enter 0 or a negative number. How can I prevent the user